[Xml] XML CSS样式表 10.8

实验1、

创建一个带有样式的XML文档。

某公司要招聘一批员工，公司经理要你编写一个XML文档。该文档要求带有招聘岗位、招聘要求、招聘截至日期等。

实验步骤 

(1)  构思  首先规划一下，编写该XML文档所需要的资源及数据。如手边的XML开发工具，该XML文档应该包含哪些数据，这些数据总的结构是什么，用草稿的形式写出大体的轮廓。每种数据都是以什么样式显示。

(2)  编写XML文档  根据上个步骤所做出的草稿，用XML文档实现，编写好后运行调试。

(3)  编写与XML文档对应的CSS文档  根据第一步所设想的样式在这个步骤中实现时，每种样式需要调用哪些标记。

(4)  调试和运行  如果上面的步骤都完成了，在这个步骤中可以进行调试，实际效果和预想的之间如出现差距、出现问题，应及时调试。

XML文档：

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="1.css"?>
<recruit>
    <job>软件工程师</job>
    <requirements>能独立开发项目</requirements>
    <deadline>2016.10.10</deadline>
</recruit>

CSS文档；

recruit {
    background-color: #ffffff;
    width: 100%;
}

job {
    display: block;
    color: #FF0000;
    margin-bottom: 30pt;
    margin-left: 20;
}

requirements {
    color: #FF0000;
    font-size: 20pt;
}

deadline {
    color: #0000FF;
    font-size: 20pt;
}

实验2

对以下“联系人.xml”进行CSS定义（设CSS文件名为“联系人.css”）

<?xml version="1.0" encoding="GB2312" standalone="no"?>
<?xml-stylesheet type="text/css" href="联系人.css"?>
<informations>
    <information>
        <name>李 明</name>
        <phone>99999999</phone>
    </information>
    <information>
        <name>林 琳</name>
        <phone>88888888</phone>
    </information>
</informations>

XML文档：

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="2.css"?>
<PRODUCTDATA>
    <PRODUCT PRODID="P001" CATEGORY="TOY">
        <PRODUCTNAME>Mini Bus</PRODUCTNAME>
        <DESCRIPTION>This is atoy for children aged 4 and above</DESCRIPTION>
        <PRICE>75</PRICE>
        <QUANTITY>54</QUANTITY>
    </PRODUCT>
    <PRODUCT PRODID="P002" CATEGORY="TOY">
        <PRODUCTNAME>Barbie Doll</PRODUCTNAME>
        <DESCRIPTION>This is atoy for children age group of 5-10</DESCRIPTION>
        <PRICE>20</PRICE>
        <QUANTITY>200</QUANTITY>
    </PRODUCT>
</PRODUCTDATA>

CSS文档；

informations { background-color: #ffffff; width: 50%;}
information { background: #EEeeEE;}
name { color: red; display: block;}
phone { color: #424242; display: block;}

实验3

教材P144页上机题第2题。

Xml:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="2.css"?>
<PRODUCTDATA>
    <PRODUCT PRODID="P001" CATEGORY="TOY">
        <PRODUCTNAME>Mini Bus</PRODUCTNAME>
        <DESCRIPTION>This is atoy for children aged 4 and above</DESCRIPTION>
        <PRICE>75</PRICE>
        <QUANTITY>54</QUANTITY>
    </PRODUCT>
    <PRODUCT PRODID="P002" CATEGORY="TOY">
        <PRODUCTNAME>Barbie Doll</PRODUCTNAME>
        <DESCRIPTION>This is atoy for children age group of 5-10</DESCRIPTION>
        <PRICE>20</PRICE>
        <QUANTITY>200</QUANTITY>
    </PRODUCT>
</PRODUCTDATA>

CSS:

PRODUCTDATA {
    background-color: #ffffff;
    width: 50%;
}

PRODUCT {
    background: #EEeeEE;
}

PRODUCTNAME {
    color: red;
    display: block;
}

DESCRIPTION, PRICE, QUANTITY {
    color: green;
    display: block;
}

还有不懂的看这里 点我 Anr-C 2016.10.8