指点成金-最美分享吧

登录

CSS背景图片自适应屏幕大小

佚名 举报

篇首语:本文由小编为大家整理,主要介绍了CSS背景图片自适应屏幕大小相关的知识,希望对你有一定的参考价值。

如何控制bodybackground:url(bglogo.gif);
在不同的分辨率显示下 保持背景图片始终全屏显示
不要设置图片的wight 和height 属性值
因为我的笔记本是14寸 而测试机器是17寸
我想让图片不管在多大的屏幕上 总是呈现100%
屏幕小 自动缩小 屏幕大 自动放大
并且始终是maggin:0 auto;的效果

使用滤镜就可以了
参考技术A 你可以准备多个尺寸的背景图,用javascript检查浏览器的分辨率,然后根据不同的分辨率调用不同的背景图片做背景。 参考技术B bodybackground:url(bglogo.gif);
默认自动上下左右平铺的。不是拉伸追问

我现在的背景太大了 显示不了全部
因为我的笔记本屏幕小
但是又不能用DIV固定他
固定了换了别的大屏幕的就又会觉得小
所以想他可以自动
图片和屏幕永远保持100%
简单的道理就不用讲解给我了

追答

1、首先你要明白背景图片没法100%。只能通过平铺的方式达到100%
2、你的背景图片超过了笔记本屏幕的大小,就没法显示全部。
3、body background:url("bglogo.gif") repeat fixed!important;
代码说明: fixed 固定,大背景不会因为你拉动滚动条而滚动
4、你反过来想一想,假如显示器有30“,你的图片100%实现了效果,图片是不是被拉伸,是不是会失真。

本回答被提问者采纳
参考技术C background-size:100%;

以上是关于CSS背景图片自适应屏幕大小的主要内容,如果未能解决你的问题,请参考以下文章