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

admin 2023-05-26 11:00:02

篇首语：本文由小编为大家整理，主要介绍了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背景图片自适应屏幕大小的主要内容，如果未能解决你的问题，请参考以下文章

Excel最多可以放多少行数据?

推荐：强大的文件格式转换神器 -- CloudConvert

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

您可能还会对下面的文章感兴趣：

相关文章