::marker

::marker CSS 의사 요소는 일반적으로 불릿 혹은 숫자를 포함하는 목록 요소의 마커 상자를 선택합니다. 이는 <li>와 <summary>처럼 display: list-item이 설정된 의사 요소나 일반 요소에서 동작합니다.

시도해보기

허용되는 속성

::marker 의사 요소는 다음을 포함한 한정적인 수의 CSS 속성을 지원합니다.

참고: 추가적인 CSS 속성에 대한 명세서가 추후 지원될 수 있습니다.

구문

css
::marker {
  /* ... */
}

예제

HTML

html
<ul>
  <li>복숭아</li>
  <li>사과</li>
  <li>자두</li>
</ul>

CSS

css
ul li::marker {
  color: red;
  font-size: 1.5em;
}

결과

명세서

Specification
CSS Pseudo-Elements Module Level 4
# marker-pseudo

브라우저 호환성

BCD tables only load in the browser

같이 보기