gpt4 book ai didi

CSS:如果大于窗口,则缩小背景图像,否则保持 100%

转载 作者:技术小花猫 更新时间:2023-10-29 11:00:35 26 4
gpt4 key购买 nike

我想在我的网站正文中部署一张背景图片,它会随着窗口分辨率缩小,但不会放大到超过其原始大小 (1920x1080)。这样一来,分辨率较小的用户仍然可以看到整个图像,但那些超出分辨率的用户不会看到丑陋的放大背景。

看起来背景图片不支持像 max-width 这样的属性,而我通常会出于这样的目的使用它。

解决方案是什么?如果没有额外的脚本,这在 CSS 中是否可行?

最佳答案

我会使用一个 div 作为具有最大宽度的包装器并将背景设置为该 div。

HTML

<body>
<div class="container">Content</div>
</body>

CSS

.container {
width: 100%;
max-width: 1920px; /* YOUR BG MAX SIZE */
background:url("bg.png") no-repeat;
background-size: 100%;
}

关于CSS:如果大于窗口,则缩小背景图像,否则保持 100%,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19682557/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com