|
1. 盒子模型有几种类型，区别是什么
标准盒模型：宽度=内容的宽度（content）+padding+border+margin
IE低版本盒模型：宽度=内容的宽度（content+padding+border）+margin
2. box-sizing属性：
①content-box：内容的宽度是content
②border-box：内容的宽度是content+padding+border
3. CSS的选择器
CSS的选择符：id选择器、类选择器、标签选择器、相邻选择器（h1+p）、子选择器（h1+p）、后代选择器
（li a）、通配符选择器（*）、属性选择器（a[rel="external"]）、伪类选择器（a:hover）
可继承的样式：font-size、font-family、color
不可继承的样式：border、padding、margin、width、height
选择器的优先级：!import>行内样式>ID选择器>类选择器>标签选择器>通配符选择器>继承选择器>浏览器默认属性
4. 优先级的计算
元素选择符：1
class选择符：10
id选择符：100
元素标签：1000
CSS优先级的法则：
5. CSS3新增伪类
p:first-of-type 选择属于其父元素的首个元素
p:last-of-type 选择属于其父元素的最后元素
p:only-of-type 选择属于其父元素唯一的元素
p:only-child 选择属于其父元素的唯一子元素
p:nth-child(2) 选择属于其父元素的第二个子元素
:enabled :disabled 表单控件的禁用状态。
:checked 单选框或复选框被选中。
6. display有那些属性值
inline（默认）–内联
none–隐藏
block–块显示
table–表格显示
list-item–项目列表
inline-block
7. position的值？
static（默认）：按照正常文档流进行排列；
relative（相对定位）：不脱离文档流，参考自身静态位置通过 top, bottom, left, right 定位；
absolute(绝对定位)：参考距其最近一个不为static的父级元素通过top, bottom, left, right 定位；
fixed(固定定位)：所固定的参照对像是可视窗口。
8. CSS3有哪些新特性？
RGBA和透明度
background-image background-origin(content-box/padding-box/border-box) background-size background-repeat
word-wrap（对长的不可分割单词换行）word-wrap：break-word
文字阴影：text-shadow： 5px 5px 5px #FF0000;（水平阴影，垂直阴影，模糊距离，阴影颜色）
font-face属性：定义自己的字体
圆角（边框半径）：border-radius 属性用于创建圆角
边框图片：border-image: url(border.png) 30 30 round
盒阴影：box-shadow: 10px 10px 5px #888888
媒体查询：定义两套css，当浏览器的尺寸变化时会采用不同的属性
9.使用纯CSS实现三角形
.box{
width: 0;
height: 0;
border-top: 40px solid transparent;
border-left: 40px solid transparent;
border-right: 40px solid transparent;
border-bottom: 40px solid #f000f0;
}
10.display:none与visibility：hidden的区别？
display：none 不显示对应的元素，在文档布局中不再分配空间（回流+重绘）
visibility：hidden 隐藏对应元素，在文档布局中仍保留原来的空间（重绘） | 
转播
