www.baike369.com
百科369 > XML教程 > XML使用CSS样式表设置元素的相对定位方法

XML使用CSS样式表设置元素的相对定位方法


XML使用CSS样式表设置元素的相对定位方法

1. XML文档name.xml的源代码如下:

<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet type="text/css" href="name.css" ?>
<page>
   <pageNumber>1</pageNumber>
   <paragraph>This book is called <reference>Beginning XML</reference>
   <footnoteNumber>3</footnoteNumber>, it will help you to learn
   <keywords>XML</keywords>.</paragraph>
</page>

2. CSS样式表文件name.css的源代码如下:

footnoteNumber {
   position:relative; top:3px;
   display:inline;
   font-size:9pt; font-weight:bold;
   color:#990000;
   border-style:solid; border-width:2px; border-color:#CCCCCC;}
page {
   display:block;
   padding:10px;
   margin:10px;
   border-style:solid; border-width:4px; border-color:#000000;}
pageNumber {
   display:inline;
   font-style:italic;
   border-style:solid; border-width:4px; border-color:#CCCCCC;}
paragraph {
   display:block;
   padding:10px;
   border:solid; border-width:4px; border-color:#CCCCCC;}
reference {
   display:inline;
   font-style:italic;
   color:#CC3333;
   border:solid; border-width:2px; border-color:#CCCCCC;}
keyword {
   display:inline;
   font-weight:bold;
   color:#990000;
   border:solid; border-width:2px; border-color:#CCCCCC;}

3. 在浏览器中显示name.xml文档的效果。如下图所示:

XML使用CSS样式表设置元素的相对定位方法

Copyright© 2011-2016 www.baike369.com All Rights Reserved