背景图片自适应

<body style="background-color:#d43167">
<div style="position: absolute;z-index: -1; top:0px; left:0px; 100%; " ><img src="img/bg.png " width="100%" height="100%"/></div>

<div style="position: absolute;z-index: 1; 80%;margin-top: 10%; left:10%"><img src="img/logo2.png" width="100%" height="100%" /></div>
</body>

之前看见在div里面用了height:100%的,但是要注意的是:如果父级没有设置高度这个属性是用不上的,这时候如果你div里面又没有放东西,是没有显示效果的,只会显示背景色




所以要解决这个问题(不用js方法的话),一是:可以事先设置好父级的高度,二是:在里面放足够的元素;撑起div的高,再用合适的margin;padding;元素的height撑到自己想要的高度,如果不想用px设置,可以用百度比设置如:margin-top:10%;

在用百分比让元素居中的方法:position:absolute:top:50%;margin-top:-(元素高度)/2;left:50%;margin-left:-(元素宽度)/2;
慢但努力着
原文地址:https://www.cnblogs.com/wangrongxiang/p/5177717.html