CSS
Cascading Style Sheets的缩写，一般翻译为层叠样式表。
0.引入方式：
内联---priority最高
内部---第二
外部---第三
<link rel="stylesheet" href="../css/style.css" />
优先级高的会覆盖优先级低的样式。
1.基本样式
- 文本样式
text-align: 设置文本水平对齐方式，
常用值：left right center
line-height: 设置文本行高属性
text-indent： 设置文本首行缩进
text-decoration:设置文本装饰
常用属性：none 默认值：标准
underline： 设置文本下划线
overline: 设置文本上划线
line-through：设置文本删除线
letter-spacing: 设置字符间距，常用取值为3px,8px
- 字体
font-family 类型
font-size 大小
font-weight 粗细，bold（粗体），lighter（细体），normal（默认字体）
font-style 风格，常用取值：italic（斜体样式字体）、oblique（倾斜体样式字体）、normal（正常字体）
- 背景样式
background-image 背景图片 background-image： url(images/bg.png)
background-repeat 背景平铺方式 background-repeat：no-repeat
属性值
repeat 横纵向都平铺，默认值 小方块图平铺构建整体背景
repeat-x 横向平铺 细长小图实现渐变效果
repeat-y 纵向平铺 小图背景实现特殊边框
no-repeat 背景图不重复平铺 大图做背景或使用偏移量控制
background-position 背景初始位置 background-position:20px -100px(分别表示横向和纵向的位置坐标)
背景图出现的初始位置 含义
Xpos Ypos 像素值表示背景出现的位置
X% Y% 百分比表示背景出现的位置 30% 50%（垂直方向居中，水平方向偏移30%）
X方向 Y方向关键词 关键词表示背景出现的位置，水平方向的关键词有left、center、right 垂直方向的关键词有top、center、bottom 可以使用水平和垂直方向的关键词进行自由组合。例如：right top(右上角出现)
- 链接样式
/*未访问链接:红色*/
a:link{color: red;text-decoration: none;}
/*已访问链接:绿色*/
a:visited{color: green;text-decoration: none;}
/*鼠标移动到链接上:紫色*/
a:hover{color: purple;text-decoration: none;}
/*鼠标点击时:蓝色*/
a:active{color: blue;text-decoration: line-through;}
- 列表样式
none 无标记符号 list-style-type:none;
disc 实心圆，默认 list-style-type:disc;
circle 空心圆 list-style-type:circle;
square 实心正方形 list-style-type:square;
decimal 数 字 list-style-type:decimal;
image 图 像 list-style-type:url(../image/img.jpg);
- 样式浮动
float浮动属性，用于设置标签对象的浮动布局（<div>、<span>、<a>、<em>。。。）
浮动作用：通过css定义float（浮动）让div样式层块，向左或向右（靠）浮动。
float:left;/*设置左浮动，改为横向排列*/
- 表格样式
边框合并：border-collapse: collapse;
2.CSS选择器
标签选择器（也称为元素选择器）
p{ }
类选择器
.classname{ }
id选择器
#idvalue{ }
并集选择器
nav,ul,li{ }
后代选择器 作用于所有后代
nav ul li{ }
子元素选择器 作用于第一代后代
ul>li{ }
兄弟选择器
h1+#p1{ } 选得是h1的兄弟#p1, 而不是h1
伪类选择器
a:link
a:visited
a:hover
a:active
属性选择器 对带有指定属性的 HTML 元素设置样式
a[title=" "]{ }
3.CSS浮动,定位,盒子模型,div+CSS网页布局
盒子模型的四要：content(内容)、border(边框)、padding(内边距)、margin(外边距)
float即为浮动，可以使用“float:浮动方向”设置某个元素的浮动行为，该元素脱离常规的文档流，向左或右移动，
直到它的外边距碰到父元素（容器）的边框或另一个浮动元素的边框为止。
float:left 设置元素左浮动
float:right 设置元素右浮动
在实际的页面布局应用中。有时需要强制换行，避免影响页面效果，这时就需要使用clear清除浮动。
Clear：left 在左侧不允许有浮动元素
Clear：right 在右侧不允许有浮动元素
Clear：both 在左右侧均不允许有浮动元素
