id선택자 2

[CSS] id / class 선택자

[개요] 태그에서 설정한 id나 class 속성에 따라 스타일을 지정합니다. id에 줄 경우 아래처럼 #을 맨 앞에 붙여 사용하며, 원칙적으로 하나의 객체에만 적용할 수 있습니다. #아이디{ 속성1:속성값; 속성2:속성값; } class에 줄 경우 아래처럼 . 을 맨 앞에 붙여 사용하며, 여러 객체에 적용할 수 있습니다. .클래스명{ 속성1:속성값; 속성2:속성값 } [사용법] #m_box{ width:500px; height:300px; } .box{ background-color:blue; } [예제] [결과]

STUDY/디자인 2020.11.18

[CSS] 선택자

CSS는 어떤 태그들에게 스타일 효과를 주는 언어입니다. 어떤태그에 적용하는지를 정의하는 문법이 필요하게 되는데, 이때의 문법을 선택자라고 합니다. 선택자 { 속성1: 값1; 속성2: 값2; } CSS는 위 예시처럼 선택자를 먼저 쓰고 중괄호 {} 안에 속성과 값을 적는 방식으로 이루어져 있습니다. CSS의 선택자는 다음 3개로 이루어져 있습니다. 태그 선택자 id 선택자 class 선택자 [태그선택자 예시] 태그이름 { 속성1: 속성값1; 속성2: 속성값2; } [id 선택자 예시] #아이디{ 속성1:속성값; 속성2:속성값; } [class 선택자 예시] .클래스명{ 속성1:속성값; 속성2:속성값 } 이 3개의 선택자를 조합하는 방식으로 원하는 태그에 원하는 스타일을 적용시킬 수 있습니다.

STUDY/디자인 2020.11.16