0

我正在编写一些 CSS 来自定义 XML 文档的显示。基本上我想自定义子元素的显示,并将它们呈现为类似于 HTML OL/UL/LI 元素。

我的 XML 结构如下:

 <?xml version="1.0"?>
 <?xml-stylesheet type="text/css" href="style.css"?>
 <transcription>
      <turn>
          <speaker>Speaker Name</speaker>
          <clause>
              text here
          </clause>
          <clause>
              one or  more clauses
          </clause>
      </turn>
  </transcription>

我的 CSS 看起来像这样:

turn {
    counter-reset: item;
}

turn clause {
    display:list-item;
}

clause  {
    content: counter(item);
    counter-increment: item;
}

我正在使用这个网站:http ://www.xml.com/lpt/a/401并且基本上有一个类似的文档http://www.xml.com/2000/03/29/tutorial/examples/display1.xml,问题是 display1.xml 在 firefox 中不起作用。我确实让它在 IE、Safari、Chrome 等中工作。

任何人都可以提供可以在 Firefox 以及其他浏览器中使用的链接或解决方案吗?

4

1 回答 1

1

看起来火狐实现 display: list-item 属性的方式存在一些错误,特别是计数器值的传递。我相信这会导致在 Firefox 中显示的零,但在 chrome 中没有。

我的解决方法是忘记使用“显示:列表项”,而是直接设置项目的样式,以便它们显示为列表:

transcription {
      counter-reset: item;
}

clause {
      display:block; 
      margin-left:40px; 
}

clause:before  {
      counter-increment: item;
      content: counter(item)  ". ";
}

这适用于以下 XML:

<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="style2.css"?>
<transcription>
    <turn>
    <speaker>Speaker Name</speaker>
    <clause>
        text here
    </clause>
    <clause>
        text here
    </clause>
    <clause>
        text here
    </clause>
</turn>

让我知道你是怎么办的...

于 2010-07-20T14:56:49.980 回答