Java相关课程系列笔记之七CSS学习笔记.docx

《Java相关课程系列笔记之七CSS学习笔记.docx》由会员分享，可在线阅读，更多相关《Java相关课程系列笔记之七CSS学习笔记.docx（24页珍藏版）》请在冰豆网上搜索。

Java相关课程系列笔记之七CSS学习笔记

CSS学习笔记

Java相关课程系列笔记之七

笔记内容说明

CSS（王春梅老师主讲，占笔记内容100%）；

目录

一、CSS概述1

1.1CSS的作用1

1.2什么是CSS1

1.3CSS的基础语法1

二、如何使用CSS样式表2

2.1内联样式2

2.2内部样式表2

2.3外部样式表2

2.4三种用法的区别2

2.5CSS样式表特征和优先级3

三、CSS选择器4

3.1元素选择器4

3.2类选择器4

3.3分类选择器4

3.4元素id选择器4

3.5派生选择器4

3.6选择器分组5

3.7伪类选择器5

3.8选择器优先级5

四、CSS单位5

4.1尺寸5

4.2颜色5

4.3尺寸属性5

五、边框样式6

5.1简写方式6

5.2单边定义6

5.3单边宽度border-width6

5.4单边样式border-style6

5.5单边颜色border-color6

5.6案例6

六、框模型6

6.1框模型图6

6.2width和height6

6.3边框、内外边距对元素尺寸的影响7

6.4案例7

6.5内边距7

6.6外边距7

七、背景样式8

7.1背景色8

7.2背景图像8

7.3背景平铺8

7.4背景固定8

7.5背景定位8

7.6组合设置8

7.7案例8

八、文本/字体样式9

8.1指定字体9

8.2字体颜色9

8.3字体大小9

8.4字体加粗9

8.5文本排列10

8.6行高10

8.7文字修饰10

8.8文本缩进10

九、表格样式11

9.1垂直对齐11

9.2边框合并11

9.3边框边距11

十、布局12

10.1浮动定位说明图12

10.2什么是浮动定位12

10.3浮动定位移动图12

10.4float属性12

10.5clear属性13

10.6display属性13

十一、列表样式14

11.1列表项前的标识符号图像14

11.2列表项前使用的预设标识符号14

十二、定位14

12.1定位概述14

12.2position（定位）属性14

12.3偏移属性14

12.4堆叠属性15

12.5相对定位：

relative15

12.6绝对定位：

absolute15

1、CSS概述

1.1CSS的作用

早期，依靠HTML元素的属性设置样式，比如：

border/align；而每个元素的属性不尽相同，所以样式设置比较混乱；因此，W3C推出了一套标准：

使用某种样式声明后，所有的元素通用，即CSS产生，它是对页面的样式进行统一的定义（声明）的。

1.2什么是CSS

1）CSS（CascadingStyleSheets）：

层叠样式表，又叫级联样式表，简称样式表。

2）用于HTML文档中元素的样式定义。

3）实现了将内容与表现分离。

4）提高了代码的可重用性和可维护性。

1.3CSS的基础语法

1）样式表由多个样式规则组成，每个样式规则有两个部分：

选择器和声明。

2）选择器：

决定哪些元素使用这些规则。

3）声明：

由一个或者多个属性/值对组成，用于设置元素的外观表现。

2、

如何使用CSS样式表

一共有三种使用方式：

内联样式、内部样式表、外部样式表。

2.1内联样式

样式定义在单个的HTML元素中。

1）样式定义在HTML元素的标准属性style里。

2）不需要定义选择器，也不需要大括号。

3）只需要将分号隔开的一个或者多个属性/值对，作为元素的style属性的值。

例如：

silver;color:

blue">文本

2.2内部样式表

样式定义在HTML页的头元素中。

1）样式表规则位于文档头元素的

文本

◆注意事项：