html5怎么设置整页背景图片

html-css010

html5怎么设置整页背景图片,第1张

html5中设置整页背景图片的方法是利用css3样式:

写法如下:

img.bg {

 /* Set rules to fill background */

 min-height: 100%

 min-width: 1024px

 /* Set up proportionate scaling */

 width: 100%

 height: auto

 /* Set up positioning */

 position: fixed

 top: 0

 left: 0

}

@media screen and (max-width: 1024px) { /* Specific to this particular image */

 img.bg {

   left: 50%

   margin-left: -512px  /* 50% */

 }

}

效果如:

html5中是通过css3的background-size来控制自适应的。

直接在图片代码里面设置style,例如<img src="xxx.jpg" style="max-width:100%"/>2、要么给图片统一一个class名例如response-img,然后在css文件里面设置这个class

html5

万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改(这是一项推荐标准、外语原文:W3C Recommendation、见本处参考资料原文内容)

2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成。

1,输入position:fixed;top:0;left:0;将整个div固定在屏幕的顶部和左侧。

2、输入width:100%;height:100%;min-width:1000px;这个可以适合div的高度和宽度,而min-width是为了实现让屏幕宽度在1000px以内时,div的大小保持不变。

3、输入background-size: cover-webkit-background-size: cover-o-background-size: cover使图片随屏幕大小同步缩放,但是有部分可能会被裁切,不过不至于会露白,下面两句是为chrome和opera浏览器作兼容。

4、输入background-position:center0;使图片的位置,居中,靠左对齐。