[CSS] Attribute selector

sujip·2023년 5월 1일
0

CSS

목록 보기
8/13
post-thumbnail

Attribute selector

Attribute selector는 주어진 특성의 존재 여부나 그 값에 따라 요소를 선택한다.

구문

  • [attr]
    attr 이라는 이름의 특성을 가진 요소를 선택한다.
  • [attr=value]
    attr 이라는 이름의 특성값이 정확히 value인 요소를 선택한다.
  • [attr~=value]
    attr 이라는 이름의 특성값이 정확히 value인 요소를 선택한다.
    attr 특성은 공백으로 구분한 여러 개의 값을 가지고 있을 수 있다.
  • [attr|=value]
    attr 이라는 특성값을 가지고 있으며, 그 특성값이 정확히 value이거나 value로 시작하면서 "-" 문자가 곧바로 뒤에 따라 붙으면 이 요소를 선택한다.
  • [attr^=value]
    attr 이라는 특성값을 가지고 있으며, 접두사로 value가 값에 포함되어 있으면 이 요소를 선택한다.
  • [attr$=value]
    attr 이라는 특성값을 가지고 있으며, 접미사로 value가 값에 포함되어 있으면 이 요소를 선택한다.
  • [attr*=value]
    attr 이라는 특성값을 가지고 있으며, 값 안에 value라는 문자열이 적어도 하나 이상 존재한다면 이 요소를 선택한다.
  • [attr operator value i]
    괄호를 닫기 전에 i 혹은 I를 붙여주면 값의 대소문자를 구분하지 않는다.
  • [attr operator value s]
    괄호를 닫기 전에 s 혹은 S를 붙여주면 값의 대소문자를 구분한다.

0개의 댓글

관련 채용 정보