引子:可扩展标记语言xml(Extensible Markup Language)自己平常也用到的不多,除了在ajax处理服务器返回的数据可能会用到外(不过一般用json处理数据的比较常见)还真没怎么了解过。其实我们常用的超文本标记语言HTML和XML可是有着挺大的联系,都是从标记语言发家,未来趋势HTML很有可能会被XML取代,XML优势就体现在可扩展,HTML它就固定是w3c定义的那些个标签,但是XML的标签很灵活随你起什么名字能够更精准的表现自己页面的信息。但XML也有它和HTML相比不灵活的地方,比如怎么应用样式。
正文:HTML应用样式有三种(内联,内嵌,外部引用),XML应用样式目前完全支持的应该只有外部引用(见w3c官方说明:https://www.w3.org/TR/CSS2/intro#q2 )
<?xml-stylesheet href="x.css" type="text/css" media="all" title="描述"?>
该处理指令必须放在文档第一个标签前面;
1 <?xml version="1.0" encoding="UTF-8"?> 2 <?xml-stylesheet href="a.css" type="text/css"?> 3 <?xml-stylesheet href="b.css" type="text/css"?> 4 <test> 5 测试 6 </test>
1 <?xml-stylesheet href="#s1" type="text/css"?> 2 <doc> 3 <s id="s1"> 4 s { display: none } 5 p { display: block ; 6 color: red ; 7 } 8 </s> 9 <p>Some text... </p> 10 <p class="note">A note... </p> 11 </doc>
chrome对此完全不识别:
firefox只识别了p元素,也就是除了带引用id s的之外的元素,而且会把s元素内容原样展示:
IE对此完全不识别:
id选择器:chrome,firefox正常,IE不支持
类选择器:chrome,IE不支持,firefox奇葩,居然支持。
想浏览器都支持怎么办,可以使用属性选择器“[ ]”获取元素,这样三大浏览器就全部支持了:
1 <?xml-stylesheet href="a.css" type="text/css"?> 2 <doc> 3 <p class="test">Some text... </p> 4 <p>A note... </p> 5 </doc>
p[class="test"]{ color: red; }
参考:http://www.shanghai.ws/w3c/Style/styling-XML.html
http://www.ibm.com/developerworks/cn/xml/x-newxml/
原文:http://www.cnblogs.com/venoral/p/5205297.html