🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
## 一 、 属性的继承 ### 1.可继承的属性: >* visibility 和 cursor 可以被所有元素继承 >* 以下只可被 内联元素 继承 : letter-spacing(伪类里的), word-spacing,white-space,line-height,color,[font家族]font,font-familly,font-weight,font-size,font-style,font-variant,font-decoration,text-transform,direction >* 以下属性会被 块级元素 继承: text-align 和 text-indent >* 以下属性会被 列表元素继承: list-style,list-style-type,list-style-position,list-style-image >* 以下属性会被 表格元素继承: border-collapse ### 2.不可继承的属性 * 以下属性不可被继承: > display,margin,border padding,background,height min-height,max-height,width min-width,max-width,overflow position,left,right,top,bottom z-index,float,clear table-layout,vertical-align,page-break-after,pager-break-before 和unicode-bidi[这里有几个没见过] ##二 、 属性的默认值 * 每个样式都有自己的默认值,这里不多于赘述,只对宽高做特别说明,因为影响到了最关键的盒模型。 |可取值 | 描述 | | ------------- | ------------- | |auto|默认值。浏览器可计算出实际的宽度 | |length|使用 px、cm 等单位定义宽度 | |%|定义基于包含块(父元素)宽度的百分比宽度 | |inherit|规定应该从父元素继承 width 属性的值 | * 具体说明如下,请务必清楚每个值的情况 以便你实现正确的盒模型,而且能简化代码。 1. div标签的适用情况(普通文档流): 父标签div 子标签div 下面分析 宽度: width: 100%;父标签 的100%; width:inherit;父标签 的100%; width:initial;父标签 的100%;默认值auto,不写也是可以的; 下面分析高度: height: 100%;父标签 的100%; height:inherit;父标签 的100%; height:initial;默认值,根据内容的高度auto;如果需要设置 那么height:100%; 2. 绝对定位 (脱离文档流): 下面分析 宽度: width: 100%;定位点标签宽度 的100%;如果需要设置,那么把父标签定义为定位点 width:inherit;父标签 的100%; width:initial;内容宽度;默认值auto,;如果需要设置 那么width:100%; 下面分析高度: height: 100%;定位点标签高度 的100%;如果需要设置,那么把父标签定义为定位点 height:inherit;父标签 的100%; height:initial;默认值,根据内容的高度auto;如果需要设置 那么height:100%; 3. 备注 : 如果定位点错误的时候,height:100%所取的不是父标签的高度而是定位点标签的高度。