谈一谈 css 盒模型
CSS3 中的盒模型有以下两种：W3C标准盒模型、IE（替代）盒模型。
两种盒子模型都是由 content + padding + border + margin 构成，但是

IE 盒模型：属性 width，height 包含 content、border 和 padding.
W3C 标准盒模型：属性 width ，height 只包含内容 content，不包含 border 和 padding 。

切换盒模型:需要修改 css3 的 box-sizing 属性:

box-sizing: content-box ：标准盒模型（默认值），一般浏览器也都默认为标准盒子模型。
box-sizing: border-box ：IE（替代）盒模型，一般根据实际项目需要自行设置。

box-sizing:border-box的作用
①：没有设置box-sizing:border-box属性，宽高会加上padding和border的值， 需要我们手动去计算，减去padding和border的值，并调整content的值，以免超过给定的宽高　　　　
　②：加了box-sizing:border-box属性，padding和border的值就不会在影响元素的宽高， 相当于把padding和border的值都算在content里， 盒子模型会自动根据padding和border的值来调整content的值，就不需要手动调整
用过哪些css选择器
/ 类（class）选择器 /
.red {
color: red;
}
/ id选择器 /

box {

color: green;
}
/ 后代选择器 选择的范围比子选择器广 包括所有后代/**
.wrap .header {
font-size: 30px;
}
/ 子选择器 亲儿子选择器
.wrap>.header {
font-size: 50px;
}
/ 群组选择器 /

a ,

.b ,
p {
color: blue;
}
/ 通配符选择器 /

{

margin: 0;
padding: 0;
}
伪类选择器
静态伪类: 只能用于超链接的样式

:link 超链接点击之前
:visited 链接被访问过之后

动态伪类：针对所有标签都适用的样式

:hover “悬停”：鼠标放到标签上的时候
:active “激活”： 鼠标点击标签，但是不松手时。
:focus 是某个标签获得焦点时的样式（比如某个输入框获得焦点）