일반적으로 저는 이것을 위해 리를 사용합니다 :어떻게 스타일을 설정?
<ol class="d">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ol>
이 스타일은 다음과 같이 설정합니다.
ol.d {list-style-type:lower-alpha;}
이렇게하면 다음과 같은 결과를 얻을 수 있습니다 :
a. Coffee
b. Tea
c. Coca Cola
그러나 수정하고 싶습니다. 결과를 다음과 같이 만들려면 :
(a) Coffee
(b) Tea
(c) Coca Cola
어떻게 그렇게 할 수 있습니까? 고맙습니다.
목록 이미지를 사용하는 것 외에 목록 항목의 표시 방법을 수정할 수 없습니다. 만약 이것을하고 싶다면 여분의 마크 업과 마진/포지셔닝 트릭을 사용하여 시뮬레이션해야합니다.
죄송합니다. list-style-type의 기본 CSS에 설정되지 않았습니다. https://developer.mozilla.org/en/CSS/list-style-type에서 CSS를 통해 사용할 수있는 항목을 참조 할 수 있습니다.
글쎄 counter 관련 속성을 사용할 수 있지만 일부 브라우저 (예 : 이전 버전의 IE)에서는 제대로 지원되지 않습니다.
ol.d {
counter-reset: item;
}
ol.d li:before {
content: '(' counter(item, lower-alpha) ') ';
counter-increment: item;
}
일부 참조 : 위의 코드의
나는 카운터가 존재한다는 것을 알지 못했다 ... 고마워요. – prodigitalson
+1 그건 꽤 깔끔합니다! 내가 읽을 수있는 곳으로 추천 링크가 있습니까? – Ben
CSS 카운터 기능에 대한 [여기는 좋은 링크입니다] (http://www.quirksmode.org/css/counter.html). –
는 그것을 시도 :
ol { counter-reset: item }
li:before { content: "(" counter(item, upper-latin) ") "; counter-increment: item }
질문에 대한 답변을 수락 한 것으로 표시하려면 왼쪽에있는 체크 표시를 클릭하십시오. 질문 당 하나의 답변에만이 작업을 수행 할 수 있습니다. 이전에 답변 한 모든 질문에 대해 동일한 작업을 수행하십시오. 그것은 우리에게 감사하는 방법입니다! – BoltClock