는"표시:마커"작업에서 현재 어떤 브라우저,그리고 만약 그렇다면,얼마나?

StackOverflow https://stackoverflow.com/questions/50170

  •  09-06-2019
  •  | 
  •  

문제

나는 확신할 수 없는 경우 내 코드는 빨,또는 경우에 그것은 단지는 브라우저 파악하지 못하고 있었던 것 spec 아직입니다.

나를 시뮬레이션하는 것이 목표 목록에 마커를 사용하여 생성된 콘텐츠를 얻을 수 있도록 예를 들어의 지속 목록에서 카운터를 목록에서 순수 CSS.

그래서 아래 코드는 생각 이에 따라 올바른 사양, 은 다음과 같다:

html {
  counter-reset: myCounter;
}
li {
  counter-increment: myCounter;
}
li:before {
  content: counter(myCounter)". ";
  display: marker;
  width: 5em;
  text-align: right;
  marker-offset: 1em;
}
<ol>
  <li>The<li>
  <li>quick</li>
  <li>brown</li>
</ol>
<ol>
  <li>fox</li>
  <li>jumped</li>
  <li>over</li>
</ol>

그러나 이것을 보이지 않는 마커를 생성,에서 하나 FF3,크롬 또는 IE8beta2,그리고 내가 올바르게 기억하지 않 오페라 하거나(나 이거 오페라).

그래서,누구나 알고 있으면 마커 정 을 작동하는가?Quirksmode.org 지 않는 그것의 일반적인 도움을 자체에서 이와 관련하여:(.

도움이 되었습니까?

해결책

분명히 마커 소개되었으로 값에서 CSS2 하지 않았지만 그것을 만들 CSS2.1 기 때문에 부족의 브라우저 지원합니다.내 생각에는 도움이 되지 않은 인기...

출처: http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display (독일어)

다른 팁

Oh ouch,하지 않았다는 것을 알고:-|.는 것은 대개의 경우,다음입니다.기 때문에 대부분이 내가 가정에서는 이러한 기본적인 CSS2 성 확실히 해야에서 지원되는 브라우저지만,그렇지 않다면 그것으로 CSS2.1,그 의미가 더 많은 것이 아닙니다.

향후 참조를 위해,그것은 표시되지 않는 에 Mozilla 개발 센터, 다,그래서 아마도 Firefox 지원하지 않습니다.

또한 향후 참조를 위해,나는 나의 원래 예와 일 inline-block 대신:

li:before
{
    content: counter(myCounter)". ";
    display: inline-block;
    width: 2em;
    padding-right: 0.3em;
    text-align: right;
}
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top