如何在XHTML文档中加入CSS

一、如何在XHTML文档中加入CSS

样式可以在HTML文档中定义，也可以在一个单独的外部样式文件中定义。样式表可以分为：

1、外部样式表：将样式单独定义放在一个单独的文件中，并且在需要该样式的文档中引用。

注意：虽然外部样式表可以使用任何有效的文件名，但是推荐使用.CSS作为外部样式表文件的扩展名，以便识别文件的内容。

2、嵌入式样式表：用<style>元素将样式包含在网页内部的样式设置，其作用范围仅限于该网页。

3、内联样式表：大多数的HTML标记都包含有一个style属性，允许指定在标记显示时的样式，这种样式规则的定义方法称为内联样式。

 

二、样式规则

1、样式规则语法

（1）div.sidenav h2{......}

其中空格代表“的”，逗号代表“和”

 

三、选择器

1、伪类选择器：

      a:link用在未访问的链接

      a:visited用在已访问过的链接

      a:hover用在光标放在其上的链接

      a:active用在被点击的链接

 

四、CSS属性单位

1、长度单位：（1）绝对长度：cm、mm、in、pt、pc

                       （2）相对长度：px、em、ex

2、颜色单位：（1）用百分比值来表示

                       （2）使用0-255之间的整数来设置

                       （3）使用十六进制数组定义颜色

                       （4）使用简化的十六进制数定义颜色

                       （5）为颜色取名

3、URL单位：如果在地址中用了括号、逗号、空格、单引号、双引号，那么就必须在整个地址外面加上一对单引号或者双引号。

 

五、设置元素内容的字体

1、设置字体名称：font-family

2、设置字体倾斜度：font-style（属性值包括：normal、italic、oblique）

3、设置字体的变体：font-variant（属性值包括：normal、small-caps）

4、设置字重：font-weight（属性值包括：normal、bold、bolder、light）

5、设置字体大小：font-size（属性值为：<相对大小>|<绝对大小>|<长度>|<百分比>）

 

六、设置元素内容的文本属性

1、设置文本首行缩进：text-indent（属性值为：<length>|<percentage>）

2、设置文本对齐方式：text-align（属性值包括：left、right、center）

3、设置文本修饰方式：text-decoration（属性值包括：none、underline、overline、line-through、blink）

4、设置文本阴影特效：text-shadow（属性值包括：none |<color>[，<color>]*）

5、设置行高：text-height（它可以是：数字、长度、百分比或normal）

6、设置字间距：letter-spacing（属性值包括：normal  |  <length>  | auto）

7、设置词间距：word-spacing（属性值包括：normal  |  <length>）

8、设置文本大小写形式：text-transform（属性值包括：capitalize、uppercase、lowercase、none）

9、设置空白显示形式：white-space（属性值包括：normal、pre、nowrap）

 

七、设置元素内容的字体颜色与背景

1、color（取值：十六进制值、rgb（）函数、CSS承认的颜色名）

设置设定元素的前景颜色

2、background-color（取值：同上或transparent）

设置背景色，初始值为透明

3、background-image（取值：图片的URL地址或none）

设置背景图像

4、background-repeat（取值：repeat、no-repeat、repeat-x、repeat-y）

设置背景图像是否及如何铺排

5、background-attachment（取值：scroll、fixed）

设置背景图像是否随对象的滚动而滚动

6、background-position（取值：[<百分比> | <length> ] {1,2}   |  [top | center | bottom ]  ||  [left | center | right ]）

指定背景图片的显示位置

7、background