CSS笔记

1.CSS的定义

CSS，层叠样式表，Cascading Style Sheet，主要负责使网页更加美观

2.CSS的使用方式

1）行内引用

使用标签的style属性直接书写css属性，缺点是只能控制一个标签。

2）内部引用

使用style标签，在标签内写入属性与属性值，通过id或者类名等方式引用。

3）外部引用

将style标签写入单独的以css为后缀的文件中，在要使用的页面中通过link标签引入并使用。

3.CSS语法

css由三部分构成，分别是选择器、属性、和属性值。

选择器{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

 }

4.常用选择器

1）标签选择器

格式：

标签名称{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

 }

作用范围：所有同名标签

2）类选择器

格式：

.自定义类名{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

}

作用范围：通过class属性引入该css的标签

注意：引入类选择器的标签必须可以使用class属性，类选择器优先级高于标签选择器。

3）id选择器

格式：

#自定义id{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

}

作用范围：通过id属性引入该css的标签。

注意：id最好只使用一次。使用的标签必须有id属性。id选择器优先级最高。

4）并集选择器

格式：

选择器1，选择器2{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

}

作用范围：使用选择器中任意一个选择器的标签。

5）交集选择器

格式：

选择器名 标签名{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

}

作用范围：使用选择器的标签内的 子标签

6）通用选择器

格式：

*{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

}

作用范围：引入该css标签下的所有标签

7）伪类选择器

格式：

标签名：标签状态{

属性1：属性值1；

属性2：属性值2；

属性3：属性值3；

}

作用范围：控制标签在不同状态下的样式。

说明：标签有四种状态，按正确顺序来说是。link：没有访问过的状态。visited：访问过的状态。hover：鼠标经过的状态。active：鼠标激活（按下未松开）的状态。