HTML/CSS 강의 2일차 : span태그, id와 calss, 문단 속성, margin과 padding

2021. 12. 26. 00:43저는 HTML으로 디자인 합니다

 

 

 

<p>여기서 <span>요기요기만</span> 스타일을 다르게 주고싶다면 span태그를 쓰면 된다</p>

 

p {color:red;}
p span {color:blue;}

 

 

이렇게하면 span태그안에 있는 컬러만 블루가 된다.

 

 

 

 

 

 

 

<p id="hello">아이디는 중복 될 수 없다</p>
<p id="hello">그래서 이 태그는 안된다</p>

<p class="bye">클래스는 중복 가능</p>
<p class="bye">스타일 똑같이 적용 가능!</p>

 

 

 

<p id="hello">여기다가 스타일을 준다면? 아이디니까 스타일시트에서는 #으로 시작하고 class는 .으로 시작</p>


p#hello{
	width:1200px;
	height:130px; 
        /*여기까지가 영역잡기*/
		
        
        
        font:normal 14px/21px '바른고딕'; /*그룹속성은 (폰트스타일, 크기/행간, 폰트패밀리)*/
        color:blue;
        letter-spacing:0px /*자간*/
        text-align:justify /*텍스트 정렬(justify는 양끝정렬)*/
	text-decoration:none; /*링크는 자동 밑줄이기 때문에 기본값 밑줄 없애는거*/
        text-indent:20px; /*들여쓰기*/
        /*여기까지가 문단속성*/
        
        
        
        border:solid 1px gray; /*영역에 선넣기, 사이즈, 컬러*/
        margin:110px auto; /*영역 밖 여백값 (auto는 반응형 맞춰서 가운데 정렬)*/
        padding:20px; /*영역 안 여백 값*/
        background:rgb(211, 211, 211);

	}