目录
一、CSS基本样式修饰
1，字体常用样式
（1）font-family ：设置字体样式（像微软雅黑之类的字体有很多，可以下载一些字体扩充字体的选项）
（2）font-size：设置字体大小
有px、%、em三种表示方法；若未规定字体大小，字体默认为16像素（16px）
特别说明下em（%类似，也是父标签的百分比）：
（3）font-weight：黑体之类的设置（400 等同于 normal，而 700 等同于 bold）
（4）font-style：显示字体的样式（斜体，正常之类）
normal、italic、oblique normal是正常，后两个是不同的两种斜体
（5）line-height：这不是行高哦！这是行与行之间的距离，尤其是设置行的位置时要经常遇到
属性值表示方式：
固定值（如：line-height:36px; ），
相对值（如：line-height:1.5em;）
2，文本常用样式
（1）文本缩进：text-indent (text-indent:2em; 还比较好用，做首行缩进)
（2）水平对齐：text-align
常用属性值有三种：left、center、right
（3）文本修饰：text-decoration
设置文本的修饰效果
无装饰，上划线，下划线，删除线，文本闪烁
属性值：none, overline, underline, line-through, blink
（4）文本颜色：color
3，超链接样式
超链接有四种状态：
未被访问的超链接a:link
鼠标经过超链接a:hover
链接被点击的那一刻a:acitve
访问过的超链接a:visited
设置参考：
4，背景类样式
（1）background-color ： 背景色
（2）background-image：背景图片
background-image: url (image/bg.jpg);
（3）background-repeat：背景重复
可选属性：
（4）background-position：背景定位
属性值：
也可以用百分比、px描述（比如 50px 100px）
（5）background：背景综合设置
5，列表样式
（1）list-style-type：列表类型
可选属性：
（2）list-style-position：列表标志位置
属性： outside、 inside（是否在列表中显示列表符号）
（3）list-style-image： 列表项图像
list-style-image:url(image/arrow.gif);
（4）list-style：列表综合设置
list-style: square inside url(image/arrow.gif)
6，表格样式
caption-side 设置表格标题的位置。
border 设置边框
border-collapse 设置是否把表格边框合并为单一的边框。
border-spacing 设置分隔单元格边框的距离。
text-align 和 vertical-align 文本的对齐方式
由于在前端基础1有介绍，对这些样式有个印象，需要的时候比较和查一下
7，轮廓样式
（1）outline：综合设置
（2）outline-color：轮廓颜色
（3）outline-style：轮廓样式
（4）outline-width：轮廓粗细
二、网页布局
1，页面尺寸
分辨率:800x600时，页面尺寸:780x428个像素
分辨率:640x480时，页面尺寸:620x311个像素
分辨率:1024x768时，页面尺寸:1005x600个像素
2，布局思路
由整体到局部
布局的做法总结起来就是 div + css
div相当于一个容器（盒子）
div标签可以把文档分割为独立的、不同的部分
通过id或class属性区分不同的容器
3，float定位（重要）
float：浮动，定义元素在哪个方向浮动，改变页面中对象的前后流动顺序。
属性值：
float特别说明：
（1）浮动元素距离父元素边框的位置，是该侧的父元素padding+自身margin的值
（2）通常不会超过父元素的边界
（3）元素一旦浮动就不属于父元素了
（4）浮动元素不会相互重叠
（5）不能上下浮动，通常只设一种浮动即可
（6）如果父元素宽度不够，浮动元素会另起一行显示。
4，overflow溢出处理
overflow属性：
overflow说明：
（1）、父元素不设高度并且子元素浮动时，使父元素高度自动适应子元素高度。
（2）、父元素设置的高度或宽度小于子元素时，使父元素出现相应滚动条或隐藏子元素超出部分内容。
5，清除浮动 - clear
clear：用来设置该元素边上没有其他元素可以浮动
clear: left / right / both / none
left：不允许左边有浮动的元素
right：不允许右边有浮动的元素
both：不允许左右两边有浮动的元素
none：默认值，可以浮动
6，position相对定位与绝对定位
position属性：
绝对定位
position:absolute
1、与left，right，top，bottom等属性共同使用
2、如果父元素未设置position属性，则以浏览器窗口左上角为起始位置
3、如果父元素设置了position属性，则以父元素左上角为起始位置
相对定位
position:relative
1、与left，right，top，bottom等属性共同使用
2、以自身本应在的位置为起始位置
float和position相似点：
1、都是将元素浮动起来
2、元素一旦设置就与父元素没关系了
float和position不同点：
1、position与top、left等配套使用
2、float位置移动通过margin、padding等实现
3、overflow和clear对position无效
4、布局通常使用float，而不是position
顺序堆叠 z-index
1、用于体现元素在Y轴空间的堆叠关系
2、与position：absolute配套使用
3、大部分情况以数字为取值
4、可为多个元素设置