정의 목록 디스크

CSS 표시되지 :정의 목록 디스크

.about dt { 
list-style-type:none; 
font-weight:bold; 

} 
.about dd { 
list-style-type: disc; 
list-style-position: outside; 
margin-left: 0px; 
padding-left: 30px; 
}

그리고 HTML

<dl class="about"> 
    <dt>Current topics and titles </dt> 
    <dd>Fulfilling community residents&rsquo; appetite for information about 
    popular cultural and social trends and their desires for satisfying 
    recreational experiences</dd> 
...

나는 DD 전에 디스크를 원하는,하지만 그것은 크롬이나 IE에 표시 아니에요. 내가 뭘 잘못했는지 생각해? 감사합니다.

출처

2010-05-17 aslum

CSS의 :before 의사 요소를 사용하여 <dd> 직전에 글 머리 기호 문자를 삽입하거나 글 머리 기호로 배경 이미지를 사용하여 교차 브라우저로도 사용할 수 있습니다. before는 지원되지 않습니다 모든 브라우저에서.

출처

2010-05-17 20:00:11 stagas

나는 list-style-type이, ul/ol/li (목록)을 의미한다고 생각합니다. 정의 태그가 아닙니다.

목록을 사용하려면 구문을 다시 작성해야하며, 정의 앞에 • (•) 개를 추가해야합니다.

출처

2010-05-17 19:45:57

바로 당신입니다. 감사! 황소를 추가하는 유일한 단점은'list-style-position : outside;을 쉽게 복제 할 수 없다는 것입니다. ... 오, 당신은 모든 것을 가질 수는 없지만, 어디에 넣을까요? – aslum

'태그의 첫 번째 것으로 써 두겠습니다. 당신은 약간의 자바 스크립트를 작성하여 모든 글 머리 기호를 추가 할 수 있지만, 대부분의 경우 CSS 옵션을 원할 경우 목록을 사용해야합니다. –

나는 Stagas에 동의, 귀하의 def의 <dd>에 배경 이미지를 사용하십시오. 명부. 마크 업에 특수 문자를 추가하고 싶지는 않습니다. 콘텐츠를 프리젠 테이션과 분리하여 보관하십시오. 의사 요소는 Internet Explorer 7 이하에서는 렌더링되지 않습니다.

출처

2010-05-17 22:18:15

여기 stagas '접근 방식의 데모입니다 :

http://jsfiddle.net/snifty/eLXyu/1/

.about dt:before { 
    content: "\25CF"; 
    font-size:x-large; 
    color:maroon;  
} 

.about dt { 
    font-weight:bold; 
} 
.about dd { 
    margin-left: 0px; 
    padding-left: 30px; 
}

나는 디스크를 에뮬레이트하는 특정 유니 코드 문자를 사용했다. 의사 요소는 way fun입니다.

출처

2011-06-16 02:36:20

정의 목록 디스크

답변

관련 문제