第4章使用CSS格式XML文档剖析.pptVIP

第4章 使用CSS格式XML文档 4.1 CSS简介 4.1.1 CSS基本概念 CSS即层叠样式表或级联样式表，是目前在浏览器上按一定格式显示XML文档内容的主要方法之一。 CSS样式表中包含了一组设置元素显示样式的规则，最初被用来控制HTML文档内容的显示格式，同样能够用来控制XML文档内容的显示格式。 XML和HTML所采用的CSS语法是相通的，都是通过一组特定的属性设置来规定某个元素内容的显示格式。可设置的元素显示属性包括：文字的字型、字体、大小和颜色，元素内容在页面中的位置、是否分段、对齐方式，是否添加边框、背景、下划线等等。 创建专门的样式表文件，把控制元素显示格式的相关指令放在其中，使其与XML文档的数据内容分开，可以大大提高控制XML文档显示方式的灵活性，并可使得样式表本身更加容易维护。 相对于XSL（可扩展样式表语言）技术而言，采用CSS技术来显示XML文档的做法还是有局限性的。 4.1.2 CSS的创建与应用 1．建立XML文档 例如，可建立一个如书中所示的XML范例文档book_01.xml。 2．创建样式表文件 CSS样式表是一个以.css为文件扩展名的纯文本文件，可以使用“记事本”等文本编辑器来建立CSS样式表文件。 例如，可创建一个名为book_01.css的简单CSS样式表文件，用来设置上述book_01.xml文档的显示格式。 3．链接样式表到XML文档 为了引用创建好的样式表文件来格式化显示XML文档的内容，必须将相应的样式表文件链接到这个XML文档中。对于上面的范例，只需在book_01.xml文档中增加下面的链接语句即可： ?xml:stylesheet type text/css href book_01.css 4.2 CSS基本语法 4.2.1 CSS语法概述 1．CSS语句的基本格式 CSS语句的基本格式如下： 选择符 属性1:属性值1[;属性2:属性值2 …] 其中：选择符（selector）用来指定该规则所适用的元素，由一个或多个元素名或特定的标识构成；紧跟其后的是用花括号“ ”括起来的若干对属性名与相应的属性值，用来对选择符所指定的元素设置具体的显示样式。 注意：花括号中的每一个属性名与相应的属性值之间须用冒号“:”分隔；而各对属性之间则须用分号“;”隔开。 2．CSS中的注释 样式表文件也可以包含注释语句，添加注释文字有助于样式表更具可读性。注释语句由斜线加上星号“/*”作为开始，以星号加斜线“*/”作为结束，在这两个特定标记之间可以输入任何想要说明的文字。 3．CSS中字母的大小写 对于IE 浏览器而言，CSS中字母的大小写是不加区分的。但当CSS应用于XML文档时，忽略字母的大小写将会带来一定的问题。如果想使用CSS来显示XML文档，就应该让文档中各种元素的名称都完全不同，而不仅仅是字母大小写的不同。 4．CSS中属性的继承 通常情况下，在CSS中为某个元素所设置的显示格式属性会影响到该元素所包含的所有子元素，除非这些子元素重新设置了不同的格式属性。 5．在CSS使用中文 由于CSS1在支持多种字符集方面表现不佳，在CSS2中针对此问题作了改进。如果要在CSS中使用中文简体字符集，需要在CSS文件的第一行加上如下指令： @charset gb2312; 4.2.2 CSS选择器 标签选择器 通用选择 * 　　通用选择器 * ，最常用的就是 * margin:0; box-sizing:border-box; 。 单标签选择 最通用的选择模式。 多标签选择（使用多个元素与多个规则） 使用多个元素与多个规则 多个元素应用一个规则： Title,author,price,memo margin:8px 一个元素应用多个规则： title display:block title font-size:12pt;font-weight:bold 使用CLASS属性 class 选择器用于描述一组元素的样式，class 选择器有别于id选择器，class可以在多个元素中使用。 class 选择器在XML中以class属性表示, 在 CSS 中，类选择器以一个点“.”号显示。 例子：book_02.xml,book_02.css 使用ID属性 id 选择器可以为标有特定 id 的 XML 元素指定特定的样式。 XML元素以id属性来设置id选择器,CSS 中 id 选择器以 # 来定义。 使用STYLE 属性 使用style属性可以直接在XML中设置元素的显示样式。如果元素的style属性设置的显示格式与样式表中设定的显示格式冲突，则style设定的样式拥有优先权。用法与CSS中设置元素样式语法相似。 使用上下文选