响应式布局？？
vertical-align失效问题??
1.从重排的性能得出，div尽可能少，不要写一些无用的div多加嵌套
比如<ul><li></li></ul>就可以了，没有必要再在外面加一个div标签
2.什么情况下是标准盒模型，什么情况下是IE盒模型，以及什么是标准盒模型，什么是IE盒模型
3.rem em px的区别
4.DOCTYPE
html4:....public 'http://www.w3.org'...
html5:...
这个DOCTYPE的作用就是告诉浏览器读取它的规则，浏览器就使用这些规则去检查页面的有效性以及呈现页面效果，如果不明确，那么开启的模式就会不一样，比如原来是标准模式的，由于文档格式的表达不清就会开启了混杂模式去呈现。这里不深入讲解。
在混杂模式中使用自己的非标准盒模型（IE盒模型），IE专有的盒模型使元素比预期小
下面主要说一下什么情况下是标准盒模型，什么情况下是IE盒模型，以及什么是标准盒模型，什么是IE盒模型。
5.关于选择器
在一个元素上可以定义类，也可以通过后代选择器，官方推荐在没有复用性的情况下，确保文档结构合理，应该用后代选择器，避免使用新定义的类，使得文档结构杂乱。
div p ：后代选择器，选的是所有后代
div>p:子选择器，选的是直接后代（就是第一层）
h2+p:相邻同胞选择器：就是同一个父元素下h2元素后面的p元素（只选中一个）
属性选择器：input[name='xxx']
a[href ^='http://']//选择链接中以http开头的链接
a[href $='.doc']//选择链接中以doc结尾的文件
优先级的表格：
style 基数是1000 id选择器的基数是200
6.在没有打包工具的情况下，css里面不鼓励用多个@import url(....),因为多个数据包会影响下载时间，尽量放到一个文件里。另外link href 。。。它的速度会比import快。
box-sizing: border-box content-box //演示其区别
外边距叠加，原因见《css世界》BFC准则
只有普通文档流中块框的垂直外边距才会发生外边距叠加。行内框，浮动框或绝对定位框之间的外边距不会叠加（BFC？）
在行内框(display: inline)上设置显示的高度或宽度是没有影响的。修改行内框尺寸的唯一方法是修改行高或者水平边框,水平内边距或水平外边距，没有办法设置垂直边框，内边距或外边距。
display: inline-block 能够显示地设置宽度，高度，垂直外边距和内边距。
css中有三种基本的定位机制：普通流，浮动和绝对定位。（固定定位fixed是绝对定位的一种）
在使用相对定位时，无论是否移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其他框。
相对定位是‘相对于’元素在文档流中的初始位置，而绝对定位是‘相对于’距离它最近的已定位祖先元素，如果不存在已定位的祖先元素，那么相对于初始包含块。
浮动的框可以左右移动，直到它的外边缘碰到包含框或另一个浮动框的边缘。
浮动元素脱离了文档流，不影响周围的元素。但是，对元素进行清理实际上为前面的浮动元素留出了垂直空间。
清除浮动的三种方法：1.新增一个div 设置clear:both
2.overflow: hidden 3.利用伪元素
.xxx: after{
content:' ';height: 0; visibility: hidden; display: block; clear: both;
}
a:hover,a:focus,a:active{text-decoration:underline}
a:link,a:visited{text-decoration:none}
此时第一行，即鼠标悬停和激活样式不起作用，因为当两个规则具有相同的特殊性时，后定义的规则优先。
所以最好要按照以下次序应用链接样式：
a:link,a:visited,a:hover,a:focus,a:active
透明度的两种表示
1.opacity:0.8
2.filter:alpha(opacity=0.8)
RGBa,为什么会有RGBa,因为设置透明度会对整个都设置透明度,包含背景和文字,有RGBa就会方便很多,可以单独对背景或者文字通过设置颜色就顺带把透明度给设置了.
为了便于计算与理解,将主体的字体设置为62.5%.
1em约等于10像素,页面的默认字体是16像素,16px*62.5%=10px = 1em,所以将主体的字体设置为62.5%
浏览器默认字体大小为16px 设置body的大小 font-size: 62.5% 就是10px=16x62.5%。就是1em字体大小，要用12px字体就是1.2em这样就明白了
body {
font-size: 62.5%; /* font-size 1em = 10px */
}
p {
font-size: 1.2em; /* 1.2em = 12px */
}
(多列布局)底部对齐的hack方式
padding-bottom:520px;
margin-bottom:-500px
网友评论