javascript 如何使背景图像在 html 中不可调整大小?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14076972/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make background image not resizable in html?
提问by Michael Yuzhiheng Xiao
body {
background: url('../../asset/background.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
This is my code for an background image. I want the image to be not resizable when I am resizing the browser.
这是我的背景图像代码。我希望在调整浏览器大小时图像不可调整大小。
回答by Elliot B.
You shouldn't use background-size:cover;
. With that CSS you're telling the browser you want the background image to expand to cover the whole background area.
你不应该使用background-size:cover;
. 使用该 CSS,您告诉浏览器您希望背景图像扩展以覆盖整个背景区域。
If you want the background image centered and not resized, just do this:
如果您希望背景图像居中而不调整大小,请执行以下操作:
body {
background: url('../../asset/background.jpg') no-repeat center center;
}
You can position the background in any manner you like, here are more options.
您可以以您喜欢的任何方式定位背景,这里有更多选项。
回答by user1884047
Try setting the background size:
尝试设置背景大小:
background-size: 100px 100px;