CSS
1.css样式权值：
标签权值为1，类选择符权值为10，id选择符权值最高为100，继承的权值最低（0.1）。当相同权重的样式存在时，会根据css样式的前后顺序来决定，处于最后面的css样式会被应用。
内联样式表（标签内部）>嵌入样式表（当前文件中）>外部样式表（外部文件中）。
!important优先级样式最高。eg.p{color:red !important;}
!important>用户自己设计的样式>网页制作者样式>浏览器默认样式.
2.css格式化排版
文字字体font-family, 字号font-size, 颜色color, 粗体font-weight:bold; 斜体font-style:italic; 下划线text-decoration:underline; 删除线text-decoration:line-through;
段落缩进：text-indent:2em; (2em指文字2倍大小）； 行间距（行高）：line-height:2em; 中文字间隔/字母间隔：letter-spacing; 单词间距：word-spacing;
3.元素分类：
常用块状元素：div, p, h1~h6, ol, ul, dl, table, address, blockquote, form…
常用内联(行内)元素：a, span, br, i, em, strong, label, q, var, cite, code…
常用内联块状元素：img , input…
将元素显示为块状元素：display:block; 显示为内联元素：display:inline; 内联块状元素：display:inline-block;
4.盒子模型
（1）边框border:width(thin/medium/thick/像素) style(dashed虚线/dotted点线/solid实线) color;
（2）宽度=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。
填充：上右下左（顺时针）
5.css布局模型
（1）流动模型（Flow)：默认的网页布局模式。块状元素都会在所处的包含元素自上而下按顺序垂直延伸分布，宽度为100%；内联元素都会在所处的包含元素内从左到右水平分布显示。
（2）浮动模型（Float）：让块状元素并排显示。float:left/right.
（3）层模型（Layer）：让html元素在网页中精确定位。position:absolute/relative/fixed.
绝对定位（absolute)：将元素从文档流中拖出来，使用top/bottom/right/left相对于其最接近的一个具有定位属性的父包含块进行绝对定位。
相对定位（relative)：相对于以前的位置移动，移动方向由top,left,bottom,right决定，偏移前的位置保留不动。
固定定位(fixed)：始终位于浏览器内视图的某个位置，不受文档流动或滚动条影响。
relative与absolute组合使用：1》参照定位的元素必须是相对定位元素的前辈元素；
<div id="box1"><!--参照定位的元素-->
<div id="box2">相对参照元素进行定位</div><!--相对定位元素-->
</div>2》参照定位的元素必须加入position:relative.
#box1{ width:200px; height:200px; position:relative; }3、定位元素加入position:absolute，便可以使用top、bottom、left、right来进行偏移定位了。
#box2{ position:absolute; top:20px; left:30px; }这样box2就可以相对于父元素box1定位了（这里注意参照物就可以不是浏览器了，而可以*设置了）。
6.水平居中显示
（1）定宽块状元素：width=…px; //定宽，宽度必须有； margin:…px auto;
(2)不定宽块状元素：
1》加入table标签。第一步：为需要设置的居中的元素外面加入一个 table 标签 ( 包括 、、 )。第二步：为这个 table 设置“左右 margin 居中”（这个和定宽块状元素的方法一样）。 2》改变块级元素的display为Inline类型，然后使用text-align实现居中。3》给父元素设置float;position:relative;left:50%; 子元素设置position:relative;left:-50%;
7.垂直居中
（1）父元素高度确定的单行文本：height与line-height一致。
（2）父元素高度确定的多行文本：1》插入table,同时设置vertical-align:middle;(td默认vertical-align:middle). 2》设置块级元素的属性
display:table-cell;/IE8以上及Chrome、Firefox/
vertical-align:middle;/IE8以上及Chrome、Firefox/
8.隐形改变display类型
1. position : absolute
2. float : left 或 float:right
简单来说，只要html代码中出现以上两句之一，元素的display显示类型就会自动变为以 display:inline-block（块状元素）的方式显示，当然就可以设置元素的 width 和 height 了，且默认宽度不占满父元素。