HTML_CSS

3.CSS_id와class

연쥬개발쟈 2020. 9. 21. 11:23

1. id 속성 이용 하기 

<h1 id = "hello" > Hello world </h1>
<h1 id = "code"> code </h1>

//firstStyle.css
#hello{color : pink;}
#code{color : blue;}

태그 안에 id = "아이디명" 을 지정하고 스타일시트 에서 id를 불러 오기 위해선 앞에 #을 붙이고 아이디명을 쓴뒤 중괄호{} 안에서 코드작성

id명을 겹치면 안되다 각각의 태그들은 아이디명이 다 다르다 

2. class 속성 이용 하기 

<h1 class = "hello code" > Hello world </h1>
<h1 class = "code"> code </h1>

//firstStyle.css
.hello{color : pink;}
.code{color : font-size = 3px;}

태그 안에 class ="클래스명"을 지정하고 스타일시트에서 class를 불러오기 위해서 앞에 .을 붙이고 클래스명을 쓴뒤 중괄호 안에서 코드작성

class 명은 겹칠수 있다. 같은 요소를 주고 싶은 태그에는 같은 클래스를 붙인다. 

한 태그 안에 여러개의 클래스를 넣을수도 있다. 해당되는 클래스 요소 다 지정받음