Detailed introduction to formatting XML documents using CSS style sheets

Source: Internet
Author: User
This article applies to friends who have certain CSS basics. If you do not have the CSS basics, you can learn from the Chinese w3schools. This article applies to friends who have certain CSS basics. If you do not have the CSS basics, you can learn from the Chinese w3schools.

1. introduce CSS styles in XML.

There are two methods to introduce CSS style sheets in XML. One is to directly embed CSS styles in XML documents, and the other is external introduction (it seems that many of the methods introduced in the WEB have these two methods ). The method for embedding CSS styles in XML is as follows:

1
 2
 3
 
  
4
  
   
5 book {6 display: block; 7 background-color: # FFE4C4; 8 margin: 5px; 9} 10 name {11 display: block; 12 line-height: 30px; 13} 14 author {15 display: block; 16 line-height: 30px; 17} 18 date {19 display: block; 20 line-height: 30px; 21} 22
  23
  
   
24
   
    
Xml application series
   25 children26
   
    
2009-03-
   27
  28
 

Code description: The first line is the header declaration of the XML file. as a well-formatted Xml document, you should add the header declaration information. The second row is the CSS style declaration. xml-stylesheet indicates adding a style sheet to the XML document, type = "text/css" indicates that the type of a style sheet is CSS. The content in the middle of lines 4 and 22nd is the CSS style content, where the fourth row is used to declare and add CSS code, and the fourth row is its closed tag. The following lines are the content of the XML document. After adding the CSS style, open the XML document in IE. The effect is as follows:

The second method is external reference. Example code of external reference:

1
 2
 3
 
  
4
  
   
5
   
    
Xml application series
   6. toddler7
   
    
2009-03-23
   8
  9
 

Code description: Bytes. The following lines are the content of the XML document. The style I wrote in bookstyle.css is as follows:

 1     book{ 2       display:block; 3       background-color:gray; 4       margin:5px; 5     } 6     name{ 7       display:block; 8       line-height:30px; 9     }10     author{11       display:block;12       line-height:30px;13     }14     date{15       display:block;16       line-height:30px;17     }

The only difference between this style and the first style is that the background is changed to gray, and the effect displayed in IE is:

2. set the display effect of the XML document in CSS.

Use the selector in CSS to format the XML document. The selector is generally one or more XML tags, such as the book and name above. the displayed attributes and attribute values are in curly brackets. the attributes and attribute values are separated by colons. With CSS, you can use the dispaly attribute to set whether the label content is displayed. the attribute values include none, block, inline, and list-item. In addition, CSS allows you to set the font, color, text, margin, border, fill, and positioning of XML display. These usage methods are the same as those in HTML. The next article describes how to use XSLT to templated XML documents.

The above is the detailed description of formatting XML documents using CSS style sheets. For more information, see other related articles in the first PHP community!

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.