H5 background image adaptive screen solutions to problems

 

Today is also the chance of experiencing this problem, Heisei rarely used content on css, just find a lot of a method, concluded several very practical way

method 1:

<style>

body{
background:url(beijingtu.gif) top left;
background-size:100%;

}

</style>

 

Method Two:

<body>

<div id="Layer1" style="position:absolute; width:100%; height:100%; z-index:-1">

<img src="beijingtu.gif" height="100%" width="100%"/>

</div>

</body>

 

Method three:

First use a style tag

<style>

.background_img{

background:url("beijingtu.gif") no-repeat;

background-size: 100%; // this setting the picture covered the entire background

}

</style>

 

Then use the body in

<Body class = "background_img"> page content </ body>

Guess you like

Origin www.cnblogs.com/nuanyang76/p/12068225.html