css10.10

CSS（层叠样式表）

定义如何显示HTML元素

1、CSS的三中引入方式：行内样式（内联），内部样式表，外部样式表。

2、语法：CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。每条声明由一个属性和一个值组成。

3、选择器

3.1 元素选择器 div{}

3.3 类选择器 .cl{}

3.4 ID选择器 #id{}

3.5 属性选择器 [type=‘text’]{}

优先级问题：

内联 》 ID选择器 》类选择器 》元素选择器

4、尺寸（行内元素的宽和高不生效）

width:    max-width:    min-width;

height:   max-height;    min-height;

5、背景

background-color:

background-image:url(),url();

background-repeat:背景平铺

background-position:背景图位置；水平位置  垂直位置

background-attachment:背景图固定，是否滚动

background-size:背景图尺寸width height; cover全覆盖；contain扩展到最大尺寸；

多张背景图写法：background: url() no-repeat,url();

6、文本:改变文本的颜色、字符间距，对齐文本，装饰文本，对文本进行缩进，等等。

text-indent:首行缩进；

text-align:文本行对齐方式；

text-decoration:下划线underline、删除线line-through、顶划线overline；（装饰修饰）

line-height:高度固定后，可以设置垂直居中

word-break:单词换行

white-space: nowrap;文本不换行

overflow: hidden;

text-overflow: ellipsis;文本超出显示省略号

7、字体

font-family:字体类型；可以写多个，浏览器识别的第一个；

“Microsoft Yahei(微软雅黑),SimSun(宋体),SimHei(黑体)”

font-size:字体大小；chrome最小12px;

font-weight:字体粗细；bold加粗；bolder更粗；lighter更细；400等同于normal;700相当于bold；

font-style:斜体；normal正常；italic斜体；oblique倾斜（这两个斜体在浏览器看上去相同）

color;字体颜色；