前端体系 - CSS

1.盒子模型

标准：border+margin+padding+content

IE : margin+ content(border+padding+content)

2.box-sizing属性？

用来控制元素盒子模型的解析模式：

box-sizing: W3C的标准盒子模型来解析。

border-box: IE传统的盒子模型。设置了元素的高宽之后，就包含了border+padding+height/width

3.选择器

1 2 3 4 5 6 7 8 9

id选择器(#myid) 类选择器(.myclassname) 标签选择器(div, h1, p) 相邻选择器(h1 + p) 子选择器（ul > li） 后代选择器（li a） 通配符选择器（*） 属性选择器（a[rel="external"]） 伪类选择器（a:hover, li:nth-child）

优先级（就近原则）：!important > [ id > class > tag ]
!important 比内联优先级高

4.可继承属性

可继承的属性：font-size, font-family, color

不可继承的样式：border, padding, margin, width, height

5.CSS3新增的伪类

p:first-of-type 选择属于其父元素的首个元素
p:last-of-type 选择属于其父元素的最后元素
p:only-of-type 选择属于其父元素唯一的元素
p:only-child 选择属于其父元素的唯一子元素
p:nth-child(2) 选择属于其父元素的第二个子元素
:enabled :disabled 表单控件的禁用状态。
:checked 单选框或复选框被选中。

面试题链接

• 50道CSS基础面试题（附答案）
• 《50道CSS基础面试题（附答案）》中的答案真的就只是答案吗？
• CSS 面试题总结
• front-end-interview-handbook

原文:大专栏  前端体系 - CSS