본문 바로가기
프로그래밍/웹

css 선택자

by 써드아이 2022. 3. 5.

https://www.codingfactory.net/12644


selector.class

selector selector
하위 선택 

selector > selector
자식 선택

selector ~ selector
형제 선택

selector + selector
형제 선택자중 첫번째 

selector::before
선택자 앞쪽에 무언가 한다.

selector::after

 선택자 다음에 무언가 한다.


[attr]
특정 이름(attr)을 가진 속성 선택

tag[attr]
특정 이름(attr)의 속성을 가진 tag이름의 요소 선택

tag[attr = "value"]
특정 이름(attr)의 속성에 특정 값(value)을 가진 tag이름의 요소 선택
(value값이 정확하게 일치해야함)

tag[attr ~= "value"]
특정 이름(attr)의 속성에 특정 값(value)을 가진 tag이름의 요소 선택
(value값이 정확하게 일치해야함)

tag[attr |= "value"]
특정 이름(attr)의 속성에 특정 값(value)을 가진 tag이름의 요소 선택
(value값을 포함한 단어)

tag[attr ^= "value"]
특정 이름(attr)의 속성에 특정 값(value)으로 시작하는 tag이름의 요소 선택

tag[attr $= "value"]
특정 이름(attr)의 속성에 특정 값(value)으로 끝나는 tag이름의 요소 선택

tag[attr *= "value"]
특정 이름(attr)의 속성에 특정 값(value)을 포함한 tag이름의 요소 선택

'프로그래밍 > ' 카테고리의 다른 글

[css] 체크박스  (0) 2022.03.10
[javascript] 체크박스 선택/해제  (0) 2022.03.10
플라스크 초기 사용법  (0) 2020.08.22