如何使背景图片自动缩放以适应各种屏幕各种浏览器的大小

发布网友发布时间：2022-04-27 04:44

共2个回答

热心网友时间：2022-04-24 16:42

需要编写JavaScript程序来实现。

<body style="margin:0">
<img src="背景图片.jpg" style="position:absolute;left:0;top:0;z-index:-999" id="bg" />
<div style="font-size:1000px;">网页内容</div>
<script>
var bgimg = document.getElementById("bg");
setInterval("changBg()",30);
function changBg(){
bgimg.style.width = Math.min(document.documentElement.clientWidth,document.body.clientWidth) + "px";

bgimg.style.height = Math.min(document.documentElement.clientHeight,document.body.clientHeight) + "px";
bgimg.style.left = (document.body.scrollLeft || document.documentElement.scrollLeft || window.pageXOffset) + "px";
bgimg.style.top = (document.body.scrollTop || document.documentElement.scrollTop || window.pageYOffset) + "px";
}
</script>
</body>

热心网友时间：2022-04-24 18:00

不同的显示器可能有不同的长宽比，所以，最关键的问题是，你这张图片在不同长宽比的显示器上如果要全部显示，最好需要裁减，不然就会图片变形，至于将图片变为桌面背景，这个很简单，我想你会的，现在电脑显示器基本上是16:9的宽屏，你将图片按照这个比例裁剪即可