不同的背景图像取决于屏幕分辨率?

问题描述:

您认为在不同的屏幕分辨率下处理背景图片的最佳方式是什么?

what do you think is the best way to handle background images on different screen resolutions?

我想为每个最流行的分辨率制作单独的背景只需要Jquery加载适当的一个。我也对CSS开放,谢谢大家:)

I was thinking of making a separate background for each of the most popular resolutions and just have Jquery load the appropriate one. I am open to CSS as well, thank you everyone :)

使用媒体查询

@media (min-width:800px) { background-image: url(bg-800.jpg) }
@media (min-width:1024px) { background-image: url(bg-1024.jpg) }
@media (min-width:1280px) { background-image: url(bg-1280.jpg) }

永远不能覆盖每一个可能的大小,特别是当你考虑所有的那些用户的浏览器不是全屏,所以你的设计应该有点灵活来解释这一点。

You're never going to be able to cover every single possible size, especially when you consider all those users whose browsers aren't full screen, so your design should be somewhat flexible to account for this.