UI/CSS

CSS selector 속성 선택자

다룽_ 2021. 4. 30. 11:38
728x90

css에서 가장 기본이 되고 중요한 selector(선택자)

선택자의 종류와 선택자로 어떻게 태그 선택할지 알아보자

 

속성 선택자

-속성이 정의된 태그만 선택하는 선택자

머선뜻29?

<태그1 속성1>라고 정의된 태그를
태그1[속성1]{ } 로 표현하여 꾸미기 가넝한

 

ex) <p title="a">를 p[title]로 선택할 수 있다.

/* 속성 선택자 */
1.
p[title]{
    color: skyblue;
}

2.
p[title="b"]{
    background-color: yellow;
}

 

해석

1. title이라는 속성이 정의된 p태그를 선택하여 글자색을 skyblue로 지정

2. title을 b라고 정의한 속성을 가진 p태그를 선택하여 배경을 yellow로 지정 

->1은 title속성 가진 p태그 전체에 적용되겠고,

   2는 title속성을 가진 p태그 중에서도 title이 b로 정의된 태그에만 적용 될 것이다.

'UI > CSS' 카테고리의 다른 글

CSS selector 종속 선택자  (0) 2021.04.30
CSS selector 가상클래스 선택자  (0) 2021.04.30
CSS selector 인접 선택자  (0) 2021.04.30
CSS selector 자식 선택자  (0) 2021.04.30
CSS selector 전체선택자  (0) 2021.04.30