How to apply a style to XML

Introduction: Extensible Markup Language XML (extensible Markup Language) does not use much of its own, except that the data returned by the AJAX processing server may be used outside (although it is common to use JSON to process data). In fact, we commonly used Hypertext Markup Language HTML and XML has a very big connection, are from the markup language rich, the future trend of HTML is likely to be replaced by XML, XML advantage is reflected in the extensible, HTML it fixed is the definition of those tags, But the XML tag is flexible, with what you name can be more accurate to express your own page information. But XML also has a place where it is less flexible than HTML, such as how to apply a style.

Text: There are three types of HTML app styles (inline, inline, external), and the XML application style is currently fully supported by external references only (see official description: HTTPS://WWW.W3.ORG/TR/CSS2/INTRO#Q2)

• external style sheet : HTML has link element links external style sheet, detailed description of link tag and note file can be found in my other post (http://www.cnblogs.com/venoral/p/5202221.html), However, the link element in XML is not treated as an instruction that references an external style, and XML provides a way to attach an external style sheet to the "xml-stylesheet" processing instruction. The specific usage is as follows:

• <? xml-stylesheet href= "x.css" type= "Text/css" media= "All" title= "description" ?>

2. The processing instruction must be placed in front of the first label of the document;

4. Type= "Text/css" can be omitted, but it is best not to omit this can help the browser to identify the file type and decide whether to download it without support;
6. Media= "All" can be omitted, used to set the style sheet support media, attribute values can take all,screen,print, etc.;
8. Title= "description" can be omitted, can be used to set the title, but XML does not appear when more than one preferred style sheet exists, it is all applied and cascading, unlike HTML's preferred style sheet.

9. 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 Test6 </Test>

• Inline style sheet: HTML has a style tag, which only gives a "xml-stylesheet" way to reference the style sheet externally. The http://www.shanghai.ws/w3c/Style/styling-XML.html#Embedded saw an inline style implemented using an anchor-like usage, but I did not test the browser for this support. The following test Chrome beta version: 46.0.2490.80 Firefox beta version: 44.0.2 ie beta version: 11.0

  1 <?xml-stylesheet href= "#s1" type= "Text/css"?>2 <Doc>3   <sID= "S1">4 s {display:none}5 p {display:block;6 color:red;7         }8   </s>9   <P>Some text ...</P>Ten   <Pclass= "Note">A Note ...</P> One </Doc>

  Chrome doesn't recognize this at all:

Firefox recognizes only the P element, which is an element other than the reference ID s, and displays the contents of the S element as it is:

IE does not recognize this at all:

• XML support for element selectors this is no doubt, test the XML for the ID selector, class selector support:

ID selector: Chrome,firefox normal, IE does not support

Class selector: Chrome,ie does not support, Firefox wonderful, incredibly support.

You can use the property selector "[]" to get an element, so that all three browsers support it:

1 <?xml-stylesheet href= "a.css" type= "Text/css "?>2 <Doc>3    <Pclass= "Test">Some text ...</P>4    <P>A Note ...</P>5 </Doc>

p[class= "Test"] {  color: red;}

Reference : http://www.shanghai.ws/w3c/Style/styling-XML.html

http://www.ibm.com/developerworks/cn/xml/x-newxml/

How to apply a style to XML