《XML语言ppt教程》第5章 使用CSS显示XML文档ppt课件.ppt

《《XML语言ppt教程》第5章 使用CSS显示XML文档ppt课件.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第5章使用CSS显示XML文档本章概述本章的学习目标主要内容1本章概述W3C为XML数据显示发布了两个建议规范：CSS（层叠样式表）和XSL（可扩展样式语言）。当XML文件和CSS文件或XSL文件相关联后，浏览器将按着CSS文件或XSL文件给出的显示方式来显示XML文件中标记的文本内容。2本章的学习目标样式表的基本概念如何定义CSS样式CSS选择符XML文档调用CSS的方式常用的CSS属性3主要内容5.1样式表概述5.2CSS简介5.3CSS基本语法5.4XML与CSS结合的方式5.5CSS属性5.6CSS的显示规则5.7本章小结

2、45.1样式表概述样式表是一种专门描述结构文档表现方式的文件，它既可以描述这些文档如何在屏幕上显示，也可以描述它们的打印效果甚至声音效果。样式表一般不包含在XML文档的内部，而是以独立文档的方式存在。55.1.1显示XML的两种常用样式表W3C给出了两种推荐的样式表标准：一种是常见的CSS，另一种是XSL。标记语言的发展历史65.1.2样式表的优势对于样式表而言，不管是CSS，还是XSL，都具有如下优点：表达效果丰富。可读性好。利于信息检索。文档体积小。75.2CSS简介CSS（CascadingStyleSheet，层叠样式表或

3、级联样式表）是一种样式控制语言，其基本思想是为结构文档中的各个标记定义出相对应的一组显示样式。CSS最初是为弥补HTML的不足而出现的。后来，又应用在XML上，用来格式化XML数据内容。8简单地说，将CSS与XML结合有以下3点好处：实现数据与显示方式分离，发挥XML的优势。将显示样式统一于CSS中，便于对显示样式进行统一管理。CSS语法结构简单，兼容性强，适用平台广泛。95.2.2CSS的历史CSS是由W3C在1996年正式推出的，最初的版本是CSS1。1998年W3C又正式推出了CSS2。CSS2基本涵盖CSS1，并增加了媒体

4、类型、特性选择符、声音样式等功能，还对原有的一些功能进行了扩充。现在正在使用的是CSS2.1，CSS3被分成四十多个模块，现在还处于开发中。105.2.3CSS的创建与应用1、建立XML文档。2、创建样式表文件。3、链接样式表文件到XML文档。4、在浏览器中浏览。115.3CSS基本语法CSS语句的基本格式如下：选择符{属性1：属性值1；属性2：属性值2；……属性n：属性值n；}125.3.2对XML文档有效的CSS选择符常用的有以下几类。1.类型选择符（TypeSelector）2.类选择符（ClassSelector）3.ID

5、选择符（IDSelector）4.其他选择方式135.4XML与CSS结合的方式XML文档调用CSS有3种形式，即引用一个外部CSS文件、将CSS语句嵌入到XML文档、同时应用内部CSS和外部CSS。145.4.1调用外部样式表文件调用外部样式表文件是指XML文件本身不含有样式信息，而是通过引用外部CSS文件来定义XML文件的表现形式。CSS样式表文件是一个扩展名为“.css”的文本文件，可以在XML文档的开头加入以下处理指令将指定的CSS样式表链接进来。其格式为：

6、ef="CSS文件的URI"?>155.4.2在XML文档内部定义样式在XML文档内部应用CSS是指将CSS样式直接嵌入到XML文档内部，一般来说，不建议在XML文档内部定义CSS样式。165.4.3混合方法指定样式第3种方法是综合应用内部CSS样式和外部CSS样式。在这种情况下，如果两种样式之间发生冲突，则以内部的CSS样式为准。175.4.4使用多个样式文件一个样式表文件可以被多个XML文件调用，同样地，一个XML文件也可以同时调用多个样式表文件。185.5CSS属性CSS的样式属性有很多，通过设置这些属性的值可以改变相应元素

7、的显示方式。最常用的元素属性有字体属性、颜色属性、背景属性、文本属性、边框属性等。195.5.1字体属性字体属性（font）是最常用的CSS属性，通过设置字体属性的值可以改变字体的显示方式，包括字体的字型、风格、大小、拉伸等。20font-family属性。font-style属性。font-variant属性。font-weight属性。font-size属性。215.5.2文本属性CSS中与文本样式有关的属性包括以下6种：text-align属性。text-indent属性。text-transformt属性。text-dec

8、oration属性。vertical-align属性。line-height属性。225.5.3颜色和背景属性在CSS中，通过颜色属性“color”可以设置元素的前景色，设置元素的背景色需要用“background-color”属性。23表示颜色的