第4章 CSS修饰XML文档.ppt

框模型（box） * * * 第4章 CSS修饰XML文档 层叠样式表CSS（Cascading Style Sheet，简称样式表），一般用于控制HTML和XHTML的排版格式，但也可以用于控制XML文档在浏览器上的显示效果。XML文档本身只包含数据，而不指示浏览器如何呈现文档数据。通过使用CSS来控制XML文档中各个元素的呈现方式。在本章将详细介绍CSS的基本知识以及如何在XML文档中使用CSS来控制元素在浏览器上的呈现方式。 * 本章知识要点： 了解CSS发展历史 掌握CSS基本语法规则 掌握CSS常用属性的作用及使用方法 掌握引用CSS文档的基本方法 * 4.1 CSS简介 在制作网页时采用CSS技术，可以精确地设置文字的大小、文字的间距、行距、图层重叠、绝对定位和相对定位等，但其最强大的功能还在于它的可随时插入性和易操作性。只要对CSS文档中相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者不同页面的外观和格式。CSS通过定义样式的方式来辅助XML，为XML文档制定显示样式效果。 4.1.1 CSS基本知识 万维网联盟（W3C），这个非营利的标准化联盟，在1996年制定并发布的一个网页排版样式标准，即层叠样式表，用来对HTML有限的表现功能进行补充。CSS并不是一种程序设计语言，而只是一种用于网页排版的标记性语言，其全部信息都是以纯文本的形式存在一个文档中，因此我们可以利用任何一个文本编辑工具去编写CSS文档。 * 4.1.2 CSS创建与应用 使用CSS仅能控制浏览器显示XML元素的文本内容，无法将属性、处理指令等内容指定显示样式。CSS采用元素匹配模式，将样式套用到对应的XML元素上，从而使各个元素呈现出不同的表现风格。 一个样式规则有三部分组成：选择符（selector）、属性（properties）和属性的取值（va lue）。 * 4.2 CSS基本语法 在本节将详细介绍CSS选择器的有关知识，包括CSS选择器语法结构、CSS属性与CSS属性值等内容。 * 4.2.1 CSS语法概述 CSS样式表是由若干条样式规则组成，这些样式规则可以应用到不同的元素或文档来定义它们显示的外观。每一条样式规则由三部分构成：选择符（selector）、属性（properties）和属性的取值（value）。 * 4.2.2 CSS选择器 选择器也被称为选择符。选择器不只是选择文档中的元素标记，它还可以是类（Class，这不同于Java或C＋＋中的类）、ID（给予元素特殊的名称，也便于在脚本中使用）或是元素的某种状态（如：a:link）。根据CSS选择符用途可以把选择器分为标记选择器、类选择器、层次选择器、ID选择器和伪类选择器等。 * 4.3 CSS属性设置 上面一节介绍了选择器的定义以及选择器的种类，在本节将按照属性的用途来分别介绍属性的作用以及使用方法。 * 4.3.1 设置显示属性 设置显示的属性有两个visibility属性和display属性。visibility属性用来设定定元素是显示还是隐藏。该属性取值为visible或hidden。visible表示显示，hidden表示隐藏。当visibility被设置为hidden的时候，元素虽然被隐藏了，但它仍然占据它原来所在的位置。 * * 4.3.2 设置字型属性 在HTML中的字体标记font只能提供字体颜色color、字体大小size和字体类型face三种设置，而CSS样式表则提供了多个字体属性使设计者对字体有更详细的设置，从而能够更加丰富页面效果。 * 4.3.3 设置色彩属性 任何美观的网页都离不开背景的修饰，以及丰富的色彩。没有色彩的网页是没有生机的，这就意味着一个优秀的网页设计者不仅要能够合理的安排页面布局，而且还要具有一定的色彩视觉和色彩的搭配能力，这样才能够使网页更加精美也具表现力，并给浏览者以亲切感。 属性值 描述 repeat 背景图片水平和垂直方向都重复平铺 repeat-x 背景图片水平方向重复平铺 repeat-y 背景图片垂直方向重复平铺 no-repeat 背景图片不重复平铺 4.3.4 设置边框属性 页面元素的边框就是将元素内容及间隙包含在其中的边线，类似于表格的外边线。每一个页面元素的边框可以从三个方面来描述：宽度、样式和颜色，这三个方面决定了边框所显示出来的外观。CSS中分别使用border-style、border-width和border-color这三个属性设定边框的三个方面。