目录
css三大特性
层叠性（覆盖性）
同一个标签的同一个属性被多次使用，最后设置的一次会生效，其他的都会被层叠覆盖；遵循了就近原则
继承性
有一些css属性子级元素或继承父级元素的样式，不需要单独设置，控制文字的相关属性（text-，font-，line-，color）几乎都可以被继承；
标题标签，除了h4以外都不能继承父级文字大小，建议除了h4以外的标题标签，单独设置文字大小
超链接a元素不会继承父级盒子的color颜色，因为浏览器默认给a设置默认的颜色样式，我们需要单独设置a的color颜色
权重优先级
优先级计算
01、继承性和通配符是没有权重的，如果当前元素自己有样式，就不会继承父级的样式，所以继承性的权重为0；
02、标签选择器，伪元素，的权重为1 （0,0,0,1）
03、类选择器，伪类选择器，属性选择器的权重为10 （0,0,1,0）
04、id选择器的权重为100 （0,1,0,0）
05、行内样式的权重为1000 （1,0,0,0）
06、可以给样式设置!important 提高权重 ，权重是无限大；
权重叠加：计算按照复合选择器会将一些权重进行叠加计算，直接用加法把权重相加。注意！权重叠加是不会有进位的，满10 也不会进位，就像你叔就是你叔，不能差辈份
盒子模型
四大组成部分
content内容：自己设置的宽高或者盒子默认的宽高
border边框
边框三要素
边框样式border-style：none无样式 solid实线 dashed虚线 dotted点线 double双线
边框粗细border-width
边框颜色border-color
综合写法：border: 线条样式 线条粗细 线条颜色
设置不同方向的边框：border-方位名词：线条样式 线条粗细 线条颜色
设置单独某个方向的某个属性：border-方位名词-属性：属性值；
css设置细线表格
border-collapse: collapse;
padding内边距：内容与边框之间的距离（值设置给父级盒子）
padding-方位名词：值；设置不同方位的内边距
综合写法：padding：
取值为1个值表示四个方向都一致；
取值为2个值表示： 上下 左右；
取值为3个值：上 左右 下
取值为4个值：上 右 下 左；
margin外边距：两个盒子之间的距离（值设置给父级盒子）
margin-方位名词：值；设置不同方位的外边距
综合写法：margin：
取值为1个值表示四个方向都一致；
取值为2个值表示： 上下 左右；
取值为3个值：上 左右 下
取值为4个值：上 右 下 左；
常用的开发技巧
三角形做法
设置三角形宽高为0
设置盒子描边都为透明
判断三角形的方向设置反方向描边颜色即可
如果不想要空白，就把多余的一半所在的边粗细设置为0
版心如何设置
常见技巧
版心如何设置
网页的主体内容显示的区域
版心只设置宽度和margin: 0 auto;使用多类名调用的方法
如何清除内外边距
清除内外边距
*{margin：0；padding：0； }
盒子实际占位大小计算
盒子实际占位大小计算
盒子的实际占位大小指的就是我们设置好宽高的基础上累加padding和border的大小
盒子的实际宽度 = width + 左右的padding + 左右的border；
盒子的实际高度 = height+ 上下的padding + 上下的border；
如果盒子宽高设置固定了，再去给盒子添加padding和border就会将盒子的大小撑大
解决盒子被撑大的问题
自己手动减，被撑大多少就减去多少（不推荐使用麻烦容易出错）
开启css3盒子模型自动內减，设置box-sizing:
border-box; ，浏览器解析的时候就会自动计算被撑大的大小自动减掉
外边距塌陷（穿透）
外边距塌陷
上下排列的盒子外边距合并
两个盒子上下边距不一样，边距大的会把编剧小的合并，如何解决这个问题？
单独设置给其中某一个盒子，不要两者都设置
把两个盒子用父级盒子包起来，给父级盒子开启BFC
overflow：hidden
display：flow-root
嵌套盒子外边塌陷（外边距穿透）
如果两个盒子有嵌套包含的父子级关系，如果给子级盒子设置了margin-top，效果显示父级盒子也会跟着掉下来,这个问题怎么解决？
给父级盒子利用盒子的BFC模式
display:flow-root；
overflow:hidden；
给父级盒子设置border-top
给父级盒子设置padding-top；