[HTML] span, margin

vgo_dongv·2021년 10월 29일
0

HTML5&JavaScript

목록 보기
3/15
post-thumbnail
<span> 일부분만 스타일 지정하기위해 부여하는태그 -inline
margin : 50px 상하좌우
margin: 20px(상하) auto(좌우) 
margin: 4개 다하면 시계방향

<b> = <strong>
<i> = <em>
<code>줄이 안바뀜=<pre> 줄바뀜



<!doctype html>

<html>
 <head>
    <meta charset="UTF">
    <title></title>
	<style>
	body *{
	 /* margin-top
	    margin-letf
		margin-right
		margin-bottom
	 */
	/* margin : 50px;*/
	}
	
	h1, h2, p{
		width : 70%;
		background : #81DAF5;
		text-align : center;
		margin : 20px auto;
		/* margin : 20px (top) auto(side) 40px (bottom) */
	}
	img{
	 
	 width : 300px;
	 height : 300px;
	 margin-left : 40%; 
	/* margin :50px auto; img는 인라인요소라 50px가 상하 auto가 좌우로 묶임*/
	}
	
	span{
	color : red;
	font-style : italic;
	font-size : 1.5em;
	font-weight : bold;
	background : yellow;
	}
	
</style>
 </head>
 
  <body>
    <h1>Welcome to the Web Programming!!!</h1>
	
	<img src ="../images/강아지3.jpg" alt="강아지3.jpg"title="강아지3">
	
	<p>언제든지 오셔서 질문이 있으시면 올려주세요! <span>여러분을 환영합니다.</span></p>
	
	 <h2>내용</h2>
	 <p>HTML5, CSS, Javascript, jQuer, SQL, JSP</p>
  </body>
</html>



![](https://velog.velcdn.com/images%2Fvgo_dongv%2Fpost%2F56b88eeb-ec0f-4c65-8855-2544bc12d927%2F%EC%BA%A1%EC%B2%98.PNG)








profile
삐약..뺙뺙

0개의 댓글