前端遇坑记录(二)——background-image横竖屏不统一


接上次的,这次增加了background-image,一个满屏背景。如上次所说,body已经废了,因此这次把background-image加在wrapper。

同样的,会有横竖屏高度不统一问题。

(1) 竖屏时,给wrapper设置height:100%,他高度不会变,必须加一个position:absulute

(2)但是照着上面这样做,横屏时,高度只会是屏幕高度,不是DOM高度

最后的解决办法是,wrapper的height仍旧设为百分百,正常情况下position:absolute,当屏幕横过来时,把position设置成relative。

这样横屏时的height 就时DOM的height了。


总结:height:100%得和position配合使用,不然真是大坑


你可能感兴趣的:(前端)