-- 作者:宇宙人
-- 发布时间:5/27/2004 12:50:00 PM
-- 书写CSS样式表来浏览XML文档 <转>
下面的这个XML样例文档描述了一个饭店的考核评审.它包含了一些特定的章节对这 个考核评审的不同类型的重要信息进行了描述.第一节包含了在一个名为 r"restaurant"的元素重并提供了关于饭店的名称,地址,电话.第二节是"review"元 素包含了考核的数据,考核人的名字,考核日期,得到的星数.第三节是考核的主体以 及最后一节是一个饭店的菜单的摘要. <?xml version='1.0'?> <story> <restaurant> <name>Red Apple Inn</name> <address> <street>3100 Longview Lane</street> <city>Palabro</city> <state>Wyoming</state> </address> <phone>123-555-1212</phone> </restaurant> <review> <rating stars="4">****</rating> <date>December 29, 1998</date> <reviewer><person>Louis Framptenheimer</person></reviewer> </review> <body> <p><summary>The small town of <city>Palabro</city> seems like an unlikely place for a high-class culinary establishment, but the <self>Red Apple Inn's</self> Chef <person>Alex Choperoni</person> is earning a national reputation for innovative dishes.</summary> And rightly so, if this reviewer's recent culinary experience is any example.</p> <p>Within striking distance from the ski slopes at <city>Jackson Hole</city>, the <self>Red Apple Inn</self> is a completely restored Victorian hotel, and offers a warm and elegant atmosphere and gracious service. The upscale clientele includes regular appearances by movie stars <person>Drew Barrymore</person> and <person>Matthew Broderick</person>. Reservations are a must, and during the ski season it is not uncommon for the dining room to be booked solid six weeks in advance.</p> <p>It is hard to go wrong with a menu this packed with interesting choices. The crab cakes are especially fine with a thin crisp crust that opens with a gentle prod of a fork to reveal a light, moist, almost mousse-like interior with a rich nutty flavor.</p> <p>The <self>Red Apple Inn</self> boasts one of the finest wine cellars in the region. None of the dishes we sampled were less than outstanding. Here are a few of the selections from the daily menu. </p> </body> <menu> <appetizer> <description>Crab cakes with a creamy dill sauce served with crispy herbed daikon fries</description> <price>$23</price> </appetizer> <entree> <description>Braised jumbo sea scallops on a tomato beurre blanc</description> <price>$39</price> </entree> <entree> <description>Free-range chicken breast stuffed with morels in a brandy/green-peppercorn sauce</description> <price>$31</price> </entree> <entree> <description>Tarragon roast pork loin on a bed of ginger apple slaw and caramelized onions</description> <price>$34</price> </entree> </menu> </story> 注意在这篇文当中的XML标记很少涉及到处理数据描述.没有任何关于格局排列,字 符或则颜色的设定.这些信息会在样式表中传达. 在 使用CSS 这篇文章中涵盖了怎样为一个HTML书写一个CSS样式表.这些样式增加 或者重载了HTML中的默认的内建格式动作.对于XML,默认的格式动作为"display: inline.在书写XML的样式表的首要任务是对于大多数的元素设定display 属性为 "block"或"none" 下面显示了你如何开始为饭店考核的样例生成CSS的步骤.这个样式表为主要的小节 指定了display属性为"block". story { display: block; } restaurant { display: block; } review { display: block; } body { display: block; } menu { display: block; } 将它保存为 review.css.现在我们在XML文档的开的开始部分(在story元素之前)加 入样式表指令以便它能定位到我们新建的样式表. <?xml-stylesheet type="text/css" href="review.css" ?> 基于这样一个指针,当我们在一个浏览其中打开一个XML文档的时候将提供一个最基 本的显示模式.附加的CSS属性能增强这些规则, 对于残留的XML元素将生成新增的 规则.下面是一个菜单属性的和它的子属性的样式规则的增强集. menu { display: block; border: 2px solid black; padding: 1em; background-color: #888833; color: #FFFFDD; font-family: Times, serif; font-style: italic; text-align: center; } appetizer { display: block; margin-bottom: .4em; } entree { display: block; margin-bottom: .4em; } price { display: inline; font-weight: bold; font-style: normal; } description { display: inline; } 为了完成这个样式表,附加的规则必须加入,以操纵在原文档的中的残留元素. 在CSS中使用命名域 当使用一个附加CSS样式表的XML的时候,名域(Namespaces)必须在文档元素中定义 .局部范围的名域(Namespaces)会被正确的解析,但是CSS并没有提供一个解决名域 前缀问题的机制,因此CSS规则在局部范围的名域中不能准确的与元素相对应.把所 有的名域放在文档元素上申明,确保他们都是全局的;这样就不会有前缀的冲突.默 认的名域不能被使用;所有带名域的元素必须有一个直接的前缀.另外,CSS选择器能 够只通过前缀选定带名域的元素,因此前缀在XML和样式表中必须一致. 下面是一个元素带有'HTML'前缀的样式表: HTML\:IMG { border: 2px solid black; } HTML\:A:visited HTML\:IMG { border-color: grey; } HTML\:A:active HTML\:IMG { border-color: red; } HTML\:A:link HTML\:IMG { border-color: blue; } 注意 ":"这个命名域字符必须在前有一个"\"才能与一个pseudoclass区别开来 使用HTML命名域(Namesapce) 在用CSS浏览XML的时候HTML的Namespace必须特殊对待.HTML命名域中的元素将按照 他们在HTML中的格式显示.这久允许访问那些没有赋予CSS的能力.例如一些很有用 的HTML嵌入元素是 <TABLE>, , , <SCRIPT>, and <STYLE>. <story xmlns:HTML="http://www.w3.org/Profiles/XHTML-transitional> ... <restaurant> <name>Red Apple Inn</name> <logo> <HTML:A href="javascript:alert('Visit the Red Apple Inn!')"> <HTML:IMG src="red-apple.gif" height="50" width="200"/> </HTML:A> </logo> ... 注意:在 Microsoft? Internet Explorer 5中的前缀必须保留"HTML"或者"html"以 便解释HTML元素. <HTML:STYLE> 区,能被用于在XML文当中嵌入一个CSS样式表.这个区能加强任何用 样式表指令指向的样式表.档没有一个可扩展样式表的时候,必须仍有一个样式表指 令来指明XML文档是用CSS样式表,甚至可以没有"href"属性. 下面的样例展示了如何使用HTML命名域将review.css嵌入到XMl文当中去,<HTML: STYLE>和样式表指令没有"href"属性. <?xml version="1.0"?> <?xml-stylesheet type="text/css"?> <story xmlns:HTML="http://www.w3.org/Profiles/XHTML-transitional> <HTML:STYLE> story { display: block; font-family: Arial, Helvetica, sans-serif; font-size: small; width: 30em; } restaurant { display: block; padding: 1.2em; font-size: x-small; margin-bottom: 1em; } ... </HTML:STYLE> <restaurant> ...
|