2.position:absolute+margin-top:-100px+margin-left:-100px(需要直到div的宽高)
3.flex
4.绝对定位的top,left,bottom,right都设置为0,然后通过margin:auto实现水平垂直居中
5.display:table-cellvertical-align:middletext-align:center
6.calc函数计算实现
1. DOM结构 :元素不会渲染
2. 事件监听 :不能监听DOM事件
3. 继承 :子元素不会继承
4. 性能 :改变此属性会重排,性能较差
1. DOM结构 :元素会渲染
2. 事件监听 :能监听DOM事件
3. 继承 :子元素会继承,可以通过visibility:visible来取消继承
4. 性能 :改变此属性会重绘,性能较好
1. DOM结构 :元素会渲染
2. 事件监听 :能监听DOM事件
3. 继承 :子元素会继承,而且不能通过opcity:1来取消隐藏
4. 性能 :改变此属性会重绘,性能较好
window.divicePixelRatio=2(默认)
意思是:我们css中1px相当于实际移动端设备2px
1.border-width:0.5px
2.box-shadow内阴影模拟边框,
box-shadow:inset 0px -1px 1px 1px red
3.通过viewport设置rem的基准值,就可以直接写rem了,较好的解决方案
4.伪类+transform
通过:after或:before设置border,结合定位
两侧宽度固定,中间宽度自适应
所以我们要尽量少使用以上属性和方法
要文字显示在图片上方(含文字在上层的情况,即不被图片遮挡),则文字需要脱离文档流,那么首先排除在图片上做文章的 A、B 两项。
再来看 C、D 两项,这两句都能使文字层脱离文档流,但 C 项的代码仅让文字层显示在了图片的“上层”,而 D 项不但让文字层显示在了“上层”,而且位于图片“上方”。
这道题其实不严谨,如果 #father 这层没有加相对或绝对定位的话,D 选项中的代码能让文字层跑出父容器,但不管跑哪里去,终归是显示在图片上方的,故 D 正确。