css

引入css样式的四种方式：

1. 内联样式（style属性）
2. style 标签
3. 外部文件 （CSS link）
4. @import url(xxx.css)

每一个float浮动的元素的父元素需要加上一个clearfix的类
这个类的CSS代码：
.clearfix::after{
content:'';
display:block;
clear:both;
}

开发者工具的
style是展示所有的样式；
computed是展示计算出来的样式。

div的高度是由其内部文档流元素的高度总和决定的。

文档流：文档内元素的流动方向。
内联元素流动，从左往右。
块级元素流动，从上往下。

word-break：
break-all 所有字都可以分开 （推荐中文网站）
break-word 单词可以分开 （推荐英文网站）

position:fixed 脱离文档流，相对窗口定位。
position:absolute 脱离文档流，相对于祖先元素中第一个relative定位。

给标签加display：inline-block属性会出bug，它的下面会有一个空隙，所以必须在后面再跟一个vertical-align:top。

:nth-child(n)选择器：选中某个元素，该元素必须是某个父元素下的第n个子元素。
:nth-child(odd)选择奇数子元素
:nth-child(even)选择偶数子元素
第一个子元素 :nth-child(1)=:first-child
最后一个子元素 :nth-child(n)=:last-child

box-sizing 属性允许以特定的方式定义匹配某个区域的特定元素。
例如，假如需要并排放置两个带边框的框，可通过将 box-sizing 设置为 "border-box"。这可令浏览器呈现出带有指定宽度和高度的框，并把边框和内边距放入框中。
为元素设定的宽度和高度决定了元素的边框盒。就是说，为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。

css选择器 .a.b和.a .b 的区别在于，.a .b表示符合.b的元素同时还是.a元素的后代，.a.b表示同时满足.a和.b的元素。