有没有办法防止在缩放页面时调整背景图像的大小?

时间:2022-05-28 04:54:19

The background-image is just a simple pattern that looks best at 100%. Is there a way to prevent such a background-image from being resized when zooming the page?

背景图像只是一个看起来最好的100%的简单模式。有没有办法防止这样的背景图像在缩放页面时调整大小?

2 个解决方案

#1


0  

zoom is browser feature and it's just enlarge everything you see in your browser so there is nothing you can do to keep the size of the images fixed

缩放是浏览器功能,它只是放大您在浏览器中看到的所有内容,因此您无法做任何事情来保持图像的大小不变

#2


0  

you could probably try pulling in an image into your HTML document instead:

您可以尝试将图像拉入HTML文档中:

<div id="bg-img">
    <img src="images/bg-img.jpg">
</div>

then going on to your CSS, you could apply the following style to that div holding the image:

然后继续你的CSS,你可以将以下样式应用于持有图像的div:

#bg-img{
    min-height: 100%;
    min-width: 1024px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 0;
    z-index:-4;
 }

the above style set will set your image to fit nicely into any browsers and prevent the background-image from resizing or expanding up to about 3 times of the zoom. be sure to fill in the appropriate value for the min-width so that in the event that the browser is resized, the image will maintain the correct proportion by resizing or cropping off.

上面的样式集会将您的图像设置为适合任何浏览器,并防止背景图像调整大小或扩展到缩放的约3倍。请务必填写最小宽度的适当值,以便在调整浏览器大小的情况下,通过调整大小或裁剪来保持正确的比例。

#1


0  

zoom is browser feature and it's just enlarge everything you see in your browser so there is nothing you can do to keep the size of the images fixed

缩放是浏览器功能,它只是放大您在浏览器中看到的所有内容,因此您无法做任何事情来保持图像的大小不变

#2


0  

you could probably try pulling in an image into your HTML document instead:

您可以尝试将图像拉入HTML文档中:

<div id="bg-img">
    <img src="images/bg-img.jpg">
</div>

then going on to your CSS, you could apply the following style to that div holding the image:

然后继续你的CSS,你可以将以下样式应用于持有图像的div:

#bg-img{
    min-height: 100%;
    min-width: 1024px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 0;
    z-index:-4;
 }

the above style set will set your image to fit nicely into any browsers and prevent the background-image from resizing or expanding up to about 3 times of the zoom. be sure to fill in the appropriate value for the min-width so that in the event that the browser is resized, the image will maintain the correct proportion by resizing or cropping off.

上面的样式集会将您的图像设置为适合任何浏览器,并防止背景图像调整大小或扩展到缩放的约3倍。请务必填写最小宽度的适当值,以便在调整浏览器大小的情况下,通过调整大小或裁剪来保持正确的比例。