css - 如何将 HTML 语义分配给我的 XML 元素以使其在我的网络浏览器中呈现？

Question

我有一个这样的 xml 文件:

<?xml version="1.0" encoding="UTF-8"?>
<todo>
    <list><item>first</item><item>second</item></list>
    <list><item>first</item><item>second</item></list>
</todo>

现在我想在浏览器中查看文件。我想要 <list>元素呈现为 <ul> html 元素，<item>像 <li> 这样的元素html元素。我知道我可以使用 xslt 将 xml 转换为 html 文档。但是:有没有办法直接将 html 语义分配给我列表的元素，例如使用 css(类似于 list{display:ul})或 dtd？

Answer 1

是的，这是可能的。

参见 W3C-Website Style Sheets with XML .

您可以使用 CSS 为每个 XML 元素声明浏览器应如何显示它。但是你必须比 HTML 更冗长，因为对于纯 XML 没有预定义的样式。

在 XML header 中添加对 CSS 文件的引用:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="todo.css"?>
<todo>
   <list><item>first</item><item>second</item></list>
   <list><item>first</item><item>second</item></list>
</todo>

这是一个示例 CSS 文件 (todo.css):

todo {
  display: block;
}

list {
  display: block;
  padding-left: 5mm;
  margin-top: 1cm;
}

item {
  display: list-item;
  list-style-type: circle;
}

您可以为每个元素定义显示 样式(block、inline、none、列表项).

对于 display: list-item 你还可以使用样式

• list-style-image: url(bullet.gif) 贴上子弹图标图形
• list-style-image 的值为 inside 或 outside
• list-style-type，值为 circle、disc、square、none