Howto assign HTML semantics to my XML elements to get them rendered in my web browser?

I have an xml file like this:

<?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>

Now I want to view the file in a browser. I want to have the <l开发者_如何学运维ist> element rendered like a <ul> html-element, the <item> elements like <li> html-elements. i know that I can use xslt to transform the xml into an html document. but: is there a way to directly assign the html semantics to the elements of my list, e.g. with css (something like list{display:ul}) or a dtd?

---

Yes, this is possible.

See W3C-Website Style Sheets with XML.

You can use CSS to declare for each XML element how the browser should display it. But you have to be more verbose than in HTML, because for plain XML there are no predefined styles.

In the XML header add a reference to your CSS file:

<?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>

Here is an example CSS file (todo.css):

todo {
  display: block;
}

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

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

For each element you can define the display style (block, inline, none, list-item).

For display: list-item you can additionally use the styles

• list-style-image: url(bullet.gif) to decalare a bullet icon graphic
• list-style-image with values inside or outside
• list-style-type with values circle, disc, square, none

---

No, XML is not HTML. If you want to display your XML as HTML, you will need to transform it using XSLT.

---

You cannot display XML as HTML. Use some transformation utilite (XSLT).