javascript 背景图像调整大小以适合

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3800315/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 02:16:48  来源:igfitidea点击:

Background image resizing to fit

javascriptjquerycssimage

提问by vla

I'm trying to make the background image as professional as possible so I'm thinking it's best to resize it based on the size of the browser or the resolution (not sure what's usually used, but I think browser size makes sense here). The idea is if the viewer screen is small, the background image gets smaller, and as the screen gets bigger, the image expands to fit its maximum size.

我试图使背景图像尽可能专业,所以我认为最好根据浏览器的大小或分辨率调整它的大小(不确定通常使用什么,但我认为浏览器大小在这里有意义)。这个想法是如果查看器屏幕很小,背景图像会变小,随着屏幕变大,图像会扩展以适应其最大尺寸。

I will try a CSS or even Javascript (JQuery) solution as needed.

我将根据需要尝试 CSS 甚至 Javascript (JQuery) 解决方案。

采纳答案by schnaader

I guess you're looking for something like that:

我猜你正在寻找这样的东西:

http://css-tricks.com/how-to-resizeable-background-image/

http://css-tricks.com/how-to-resizeable-background-image/

回答by Karel Petranek

You will need to stick to CSS 3 background-size property to achieve this: http://webdesign.about.com/od/styleproperties/p/blspbgsize.htm
Without using CSS 3 you cannot resize the background image in any way on the client.

您需要坚持使用 CSS 3 background-size 属性来实现这一点:http: //webdesign.about.com/od/styleproperties/p/blspbgsize.htm
如果不使用 CSS 3,您将无法以任何方式调整背景图像的大小客户。