第四章 样式语言.ppt

第四章样式语言 4 1需要样式单的原因 因为在XML文档中 使用的基本上是文档编写者自定义的标记 浏览器无法理解这些标记 XML设计的目的就是内容与表现形式是分开的 为了显示XML文档 必须有一个机制来描述如何显示文档 这种机制就是样式单 stylesheet 样式单是用于描述XML文档表现方式的文档 即可以描述这些文档如何在屏幕上显示 还可以描述它们的打印效果 甚至声音效果 样式单一般是独立于XML文档之外的 独立存在的 与HTML相比 样式单机制有许多优点 1 表达效果丰富 2 使用方便 相同的数据可以定义不同的效果 3 可重复使用 多个文档可以共享一个样式单 4 文档体积小 5 便于信息检索 6 可读性好 4 2层叠样式单 层叠样式单CSS最初是针对HTML而提出的样式单语言 它也可以用于XML文档的描述 可以描述如 元素的位置 颜色 背景 边框 字体 排版格式等 对于CSS W3C有两个标准 CSS1和CSS2 CSS2是在CSS1的基础上增加了媒体类型 特性选择符 声音样式等功能 CSS的基本思想是为XML和HTML文档中的各元素定义出一组相对应的显示样式 一个CSS样式单就是一组规则 每个规则指定了些规则所适用的元素名称 以及要应用于这些元素的样式描述信息 如 例4 1XML文档配套的CSS文档 我们可以看到打开后的效果变了 如图示 4 2 1在XML文档中引用CSS样式单在XML文档中引用CSS样式单 首先要在XML文档的序言里加上一条引用样式单的处理指令 如 在XML文档中使用CSS的方式有两种 引用方式和嵌入方式 1 引用方式 指XML文档本身不含有样式信息 通过引用外部CSS文件来定义文档的表现形式 大部份引用CSS的情况都是这种情况 具体使用方法如下 里面 stylesheet表示的它是一个处理指令 表明引用样式单 type表示它的样式单类型是css href表示样式单所在的地址 可以用绝对地址表示 也可以用相对地址表示 2 嵌入方式 它是指将CSS样式规则直接嵌入到XML文档内部 方法是为元素设置 style 属性 并在属性值中给出对其样式的定义 这种用法主要用在一些特殊的XML文档中 一般说来 嵌入CSS样式的XML文档本身就是面向显示的 4 2 2CSS的样式规则CSS的样式规则主要由两个部份组成 选择符和样式描述 选择符是用来指定CSS规则适用于哪些元素的 最常用的选择符的元素的名称 或称标记名 样式描述部分用花括号括起来 其内容是一组用于指定元素的以分号隔开的样式属性名及其属性值 样式规则定义的基本格式为 选择符 样式属性1 属性值1 样式属性2 属性值2 CSS采用样式规则来定义XML元素的输入格式 用一个选择符可以将一条规则与一个或几个XML元素联系起来 CSS经过发展 现在已经到了CSS2阶段 1 选择符大多数情况下 选择符就是被它施加样式的元素名称 浏览器在文档中碰到这些元素时 就会使用在CSS中定义好的样式来显示它们 1 标记名 把XML标记名作为选择符 表示规则将应用于这类元素 如前面例子中的 2 类名将标记的class属性的值作为选择符 表示规则将应用于class属性值等于指定类名的元素 在类名前要加一个点 如果要对文档中的一些内容进行分类处理 对不同类的内容定义不同的显式样式 可以把class属性加到这一些元素的标记中 然后编写一些规则对不同 class 属性的值定义不同的显示样式 例4 2css文档对应的XML文档 使用class定义后的效果 但我们要注意到 如果在XML文档中用定义DTD文档的话 class的属性值必须在DTD中事先声明 否则会导致出现错误 3 标记名 类名 把标记名 类名组合作为选择符 表示规则将应用于标记中含有 class 属性并且属性等于所给类名的元素 如果想把同一个类型的某些元素设计成不同的样式 可以把class属性加到这一类型的某些元素之上 然后编写规则对这些元素定义样式 例4 3css文档XML文档 标记名 类名示例的显示结果 4 标志符将带标记的 ID 属性值作为选择符 表示规则将应用于 ID 属性值等于指定标识名的元素 一般情况下 为标识定义的样式优先于为类定义的样式 例4 4css文档xml文档 标志名将标记的 ID 属性的值作为选择符 表示规则将应用于 ID 属性值等于指定标识符的元素 5 标记名 标识名 把标记名和标识名组合作为选择符 表示规则仅应用于指定标记中含有ID属性且ID属性值等于所给标识名的元素 6 父标记名字标记名 把父元素的标记名和子元素的标记名组合作为选择符 表示规则仅应用于指定元素的子元素 父标记和子标记间用空格分隔 例4 5css文档对应的XML文档 父标记名子标记名的效果 7 用逗号分隔多个选择符 表示把样式规则应用于多个元素 表达形式为 选择符 选择符 样式属性1 取值1 样式属性2 取值2 例css文档xml文档 8 通用选择符 用 表示所有元素例4 7css文档xml文档 2 设置样式属性样式属性指的是可以在样式单中设置的显示特性 CSS标准提供的样式属性包括字体属性 字形 大小 粗细 倾斜等 颜色属性 背景属性 边框属性 页边空 边框 内空等 内容编排 独立块 内联 列表 表格 隐藏等 页面排版等 一些常见的属性值请见课本135页表4 1与表4 2 根据属性的不同 属性值的选取也有所不同 属性值主要有以下4种 1 长度 单位较重要 有pt in cm px等 2 URL 给属性赋URL 如背景图等 3 颜色 在CSS中颜色是个很重要的属性 常用的方式有4种 颜色名称 十六进制数 十进制数及百分比形式 4 关键字 预先定义好的字符型属性值 组件的显示方式一般由display属性设置 此属性有block inline和none3种常用值 分别表示分块 不分块和不显示 例4 8 1 css 分块 4 8 2 css 不分块 4 8 xml 分块显示模式 block 不分块的形式 inline 6 设置块背景CSS标准提供的背景属性可以定义元素背景 元素的背景指的是围绕元素文字的区域 可设置成某种颜色 也可是图或小图片平铺 它可以帮助人们从视觉上区分元素 例4 9CSS文档xml文档 小图片平铺块背景效果 7 设置外框实际上每一部分显示内容都有一个影响基本内容布局的想像中的框 不特别设置无法看到这些框 我们可以把这个框画出来 例css文档xml文档 为XML文档指定边框 边框线有4种样式可供选择 dotted 点线 dashed 虚线 solid 实线 和double 双线 float属性可指定显示位置 如left表示这个元素将出现在网页的左侧 例css文档xml文档 增加了padding属性 4 2 3添加注解CSS样式单中的注解相当于C语言中的 如 这是一个CSS样式单文件 4 2 4继承性样式定义具有继承性 不需要为文档中的每个可能属性明确定义规则 如 如果某个子元素没有指定字号 那么这个元素将继承其父元素的字号 如果没有指定这个元素的颜色 将继承其父元素的颜色 如示例它的优点在于它的简单 但它不能重新排序文档中的元素 不能统计元素中的数据 只用于输出格式较为固定的文档 css继承示例 4 3可扩充样式单语言XSL 可扩展样式单语言XSL也是由W3C制定的 XSL和CSS都可以用来设定文档的外观 它和CSS有所不同 1 CSS是静态的 不遵守XML文档的规范 2 处理方法不同 CSS只针对结构文档中的各个成分 按照样式规定一一设定外观样式规则 再由浏览器依据这些样式规则显示文档 而XSL采用的是一种转换的思想 通过定义转换模板 将一个不含显示信息的XML文档转换为另一种可以用浏览器浏览的文档 XSL由两大部分组成 第一部份描述了如何将第一个XML文档转换为可浏览或可输出的格式 第二部份定义了格式对象FO FO是直接面向内容显示 打印格式的 第一部分即描述文档转换的这一部分比较成熟 已从XSL中分离出来 另取名为XSLT 4 3 1XSLT转换概述XSLT是XSL标准中最重要的部份 它用于将一个XML文档转换成另一种类型的文档 它可以很好的描述XML文档向任何一个格式的文档作转换的方法 XSLT可以用在显示上 根据目前浏览器的支持能力 在大多数情况下是将XML文档转换为HTML文档 通常 XSLT将每个XML元素转换成一个HTML元素 实现的方法是为XML编写一个XSL样式单 并在XML文档中引用它 为了方便地转换XML文档 XML解析器先将文档转换为一种内部模型 这种内部模型将一个XML文档表示成一棵节点树 DOM是W3C推荐的用于处理文档结点树的应用程序接口API DOM描述了一系列标准的访问XML和HTML文档的方法 一个支持DOM的解析器把XML文档中的数据变成一系列对象 并提供访问这些对象的应用程序接口 利用解析器可以实现的DOM接口可方便地访问 维护和处理XML文档 因此 整个转换过程需要3个基本组件 一个XML解析器 一个扩展的DOM文档结点树接口和一个XSLT转换引擎 如将前面例1 4的XML文档转化成HTML文档的过程是 1 将该文档解析成DOM对象 即建立了源文档的一颗节点树 2 使用XML解析器解析XSL样式单 3 按照样式单定义的转换模板进行转换 直到模板结束语句 4 读到结束转换 4 3 2XSL文档格式XSL文档的基本格式可表示为 样式单模板 说明 1 首先是XML声明 因为一个XSL文档本身就是一个格式正确的XML文档 2 XSL声明 stylesheet是XSL文档的根元素 作为样式单的开始 意思是将文档作为一个XSL样式单来处理 通常带有version属性 用于声明样式单所遵循的标准的版本 再用xmlns属性指明XSL的命名空间 现在新的标准命名空间是 http www w3 org TR WD xsl 3 xsl样式单模板规则 xsl template 表示一个模板开始 其属性 match 的取值把模板规则所定义的模板与指定的源文档的元素或属性相匹配 最先匹配的应该是文档结点树的根结点 根结点用 来表示 然后匹配其它结点 4 xsl template元素的文本内容描述了转换结果的形式 称为模板路径或输出模板 在XSL中 模板包括两个部份的内容 匹配源文档结点树中结点的匹配模式和输出文档的模板 一个XSL文档至少包含一个模板 模板可以单独成块 也可以被拼装组合 不同的模板控制不同的输出格式 XSL用输出模板描述输出格式 一个模板即包含输出文档的文本 也包括XSL指令 XSL指令告诉处理程序源XML文档中哪些数据需要复制到输出文档 模板中的所有指令都是XSL命名空间的元素 通常都用xsl 前缀来标识 模板中不加 xsl 前轻的元素就是输出文本部分 4 3 3XSLT基本元素模板规则用来定义模板 说明要处理的对象 源文档的元素 属性 处理的方式和转换结果 模板规则用XSL命名空间中的元素 template 表示 一个模板规则就是一个 template 元素 templatetemplate元素的作用是定义一个新模板 语法形式是 模板内容 其中 match属性用来指定要将此模板应用于输出文档的哪个结点 一个模板匹配一个结点 匹配模式可以是一个结点名 也可以是由结点名和表示路径及子元素位置的符号组成的结点表达式 priority属性用来指定模板的优先级数 模板总是与结点相对应的 一个结点可能对应于不同的模板 各模板匹配的先后次序按优先级数从高到低排序 template元素的内容就是输出模板 它包含一条模板规则 其中 match 给出了匹配源文档结点的模式 这个模式将模板与前面的文档的根元素进行匹配 从到间的内容均为这条规则的输出模板 例4 124 12 xsltXML文档 2apply templatesapply template的作用是对指定结点应用模板 在确定了模板规则与源文档的元素的匹配模式以后 就可以激活模板 这项功能由apply templates完成 apply templates相当于激活函数的调用指令 templates相当于具体执行处理动作的函数体 apply templates的语法形式是 其中 select用来指定应用模板的结点名称 如果在语句中没有显式的对模板进行调用 则按当前结点的模板在源文档中出现的顺序 调用所有可以调用的模板 order by用来指定排序标准 是一个可选项 属性值 排序标准列表 是 select 属性指定结点的某个子结点或以分号 隔开的的select属性指定结点的某几个子结点序列 在子结点前添加加号表示按此节点内容的升序进行排列 减号则表示以降序来进行排列 3value ofvalue of的作用是将源文档中指定元素的值写到输出文档中 它的语法的基本形式是 其中 select属性用来指定要访问的源文档的结点名称 在许多应用场合 输出模板中需要取源文档结点树中某个或某些结点的值 此时可使用 value of 元素 如果想输出指定结点的内容 可以利用select属性来指定 select 结点表达式中的结点表达表达式用于指定需要被输出的指定结点的内容 可以利用select属性来指定 value of元素实际上就是一个查询指令 可从源文档结点树中查找出指定的结点的全部内容和部分内容 结点表达式还有更多 更复杂的语法 涉及结点树的寻找和定位的功能 在后面的Xpath语法中再详细讲解 同样功能的还有copy和copy of 其中 copy只拷贝当前结点 不包含子结点和属性 而copy of的拷贝内容则包括当前结点 子结点和属性 使用方法和value of相同 4 结构控制元素XSL的逻辑语法结构