정렬된 목록 번호 매기기를 어떻게 사용자 정의할 수 있습니까?

순서가 지정된 목록 번호 매기기 사용자 정의

질문: 숫자 정렬을 변경하기 위해 순서가 지정된 목록을 어떻게 사용자 정의할 수 있습니까? 숫자 뒤의 문자를 수정하고 숫자에서 알파벳/로마자로 전환합니다. 표기법?

숫자 왼쪽 정렬:

순서가 지정된 목록에서 숫자를 왼쪽 정렬하려면 다음과 같이 CSS를 활용하세요.

ol {
  counter-reset: item;
  margin-left: 0;
  padding-left: 0;
}
li {
  display: block;
  margin-bottom: .5em;
  margin-left: 2em;
}
li::before {
  display: inline-block;
  content: counter(item) ") ";
  counter-increment: item;
  width: 2em;
  margin-left: -2em;
}

사용자 정의 번호 매기기 문자:

번호 뒤의 문자를 변경하려면 다음을 수정하세요. 위 CSS의 콘텐츠 속성. 예를 들어 마침표의 경우 ".) "로 변경합니다.

content: counter(item) ".) ";

알파벳/로마 표기법으로 전환:

숫자에서 알파벳/로마 목록으로 전환하려면 , ol 요소에 type 속성을 사용하세요.

• type="a"(소문자 알파벳의 경우) 표기법
• 대문자 로마 표기법의 경우 type="A"
• 소문자 로마 표기법의 경우 type="i"
• 대문자 로마 표기법의 경우 type="I"

호환성:

제공되는 CSS 솔루션은 Firefox 3, Google Chrome, Opera와 호환됩니다. 단, IE7에서는 완전히 작동하지 않을 수 있습니다.

위 내용은 정렬된 목록 번호 매기기를 어떻게 사용자 정의할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!