DIV+CSS是网站标准（或称“WEB标准”）中常用术语之一，div+css 是一种网页的布局方法，这一种网页布局方法有别于传统的HTML网页设计语言中的表格（table）定位方式，可实现网页页面内容与表现相分离。XHTML是The Extensible HyperText Markup Language（可扩展超文本标识语言）的缩写。XHTML基于可扩展标记语言（XML），是一种在HTML 基础上优化和改进的的新语言，目的是基于XML应用与强大的数据转换能力，适应未来网络应用更多的需求。在XHTML网站设计标准中，不再使用表格定位技术，而是采用DIV+CSS的方式实现各种定位。

正文(方法 发展)

样式

正文

方法

CSS—层叠样式表（Cascading Style Sheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。

1,在HTML文档中加入CSS

样式表可分为嵌入式样式表、外部样式表和内联样式表三种，在同一文档内可以同时使用三种方法。

2,外部样式表：

发展

样式定义放在一个单独的文件中，例：新建一个后辍为CSS的样式定义。

元素{ 属性color:值red；} 在head段使用<link>标记，

引用语法：<link rel=”stylesheet” type=”text/css” href=”样式表URL” />

3,嵌入式样式表：

<style>元素段必须出现在head段内，有一个开始和结束标记，并且可以有多个<style>段

语法格式： <style type=”text/css”>

…样式定义…

样式

在嵌入式样式表中我们可以使用@import导入一个外部样式表，例：

<style type=”txet/css”>

@import url(外部样式表位置)；

…其它嵌入式的样式定义…

</style>

4,内联样式表：

写在开始标记里面，比如你要H1变红色，

<h1 style=”color:red;”>变为红色</h1>

总结： 三种样式表优先使用外部样式表、嵌入式样式表用来调试用的、一般不使用内联样式表。

5,样式规则。

一个样式规则由一个选择器后跟一个声明块组成，声明块是一个大容器,由大括号中间的部分组成,声明块中间的空间会被忽略,,声明块由一个一个的声明组成,声明由属性和值组成,,属性和值用冒号隔开,分号结束，每个声明内只能有一个属性，如果属性值中含有空格用双引号括起来例，在一个声明块内可以有多个声明，每个声明用分号隔开。

选择器　声明块

选择一个元素　声明{ }

属性 : 值;

冒号开始分号结束 6,注释：有关的详细内容在中有详细的解释。

7,选择器分组

当遇到几个选择器共享一个声明的时候，可以分组放在一起，每个选择器必须以逗号隔开。例：h1,h2,h3,h4 { color red;} 选择器分组时要将每个选择器路径写全，分组结尾不能有逗号。

例：路径不全： #maincontent p, ul{ border-top:1pxsolid #ddd;}

正确写法：#maincontent p, #maincontent ul{ border-top:1pxsolid #ddd;}

例：结尾多了一个逗号： .a1 p, .a1 ul,{color:red;}

8,选择器

元素选择器：语法格式： 元素{color: blue;}

类选择器： 语法格式： .类名{属性: 值;}

ID选择器：#id名 {属性 : 值；} ID名不能重复

通配符选择器：语法格式：*{属性:值;}

伪类选择器：

伪类选择器可以以不同方式格式化超级链接<a>元素的四种不同状态：以下顺序依次写；（记忆方法：a Love or Hate）

a:link 是用在未访问的链接的选择器

a:visited 是用在已访问过的链接的选择器

a:hover 是用在鼠标光标放在其上的链接的选择器

a:active 是用在获得焦点（比如，被点击）的链接的选择器

如果需要，我们可以组合这几个状态，按顺序写：

a:link，a:visited { color :blue;}

a:hover ，a:active { color :blue;}

9,伪元素选择器

标准的选择器不能格式化一个元素内容的第一个字母或者第一行，而伪元素选择器能实现：

所有浏览器支持的有两种： ：first-line和 ：first-letter

例：段落的第一行：p：first-line {属性：值；}

例：段落的第一个字母：p：first-letter {属性：值；}

10,选择器的优先级

1， ID选择器；2，类选择器；

3，元素选择器；4，通配符选择器。