M-의 type="none"목록

HTML은 세 가지 유형이 있는 정렬되지 않은 목록 요소를 제공합니다.

circle (기본값)

disc

square

예, 목록의type 속성은 더 이상 사용되지 않으며 글머리기호 유형을 타겟팅하는 데 클래스를 사용해야 한다고 생각할 수도 있습니다. 대부분 동의하지만 글머리기호가 없는 목록은 의미론에 관한 것이지 스타일에 관한 것이 아닙니다. 그래서...

M- none 을 네 번째 목록 유형으로 정의합니다.

none 유형은 다음과 같이 글머리 기호를 효과적으로 끕니다.

<ul type="none">
  <li>My</li>
  <li>bullets</li>
  <li>are</li>
  <li>off</li>
</ul>

글머리 기호 또는 글머리 기호 없음은 목록에만 적용할 수 있는 변형이므로 일반 유틸리티 클래스는 적합하지 않은 것 같습니다. 저는 이러한 방식으로 구성 요소에 HTML 및 CSS를 활용하는 것을 좋아합니다. 저는 이를 TAC 방법론(태그, 속성, 클래스)이라고 부릅니다. TAC에 이어 type 속성의 용도가 변경되고 "none"이 이미 list-style 속성에서 사용되기 때문에 "none"이라는 단어가 "off"또는 다른 것보다 선호됩니다. 결과는 글머리 기호를 켜고 끄는 목록 속성이며 other list's attributes 에 추가된 것을 환영합니다.

글머리 기호 없는 목록은 자주 남용되지만(예: 링크 목록. 대신 <nav> 사용) 합법적인 경우가 있으므로 첫 번째 단계는 글머리 기호를 제거한 다음 필요에 따라 유틸리티 클래스로 사용자 지정하는 것입니다. 설계:

<ul type="none" class="flex justify-content-between">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
</ul>

M-type="none" 목록입니다. 시맨틱하고 쉽게 사용자 지정할 수 있으며 모든 스택과 호환됩니다.

작은 6kb, 프레임워크에 구애받지 않는 표준 기반M- UI 라이브러리에 대해 읽고 자세히 알아보십시오.