如何在div中设置不同屏幕分辨率的背景图像？

问题描述：

I am developing a webpage in which I am setting background with help of div but my problem is that when the resolution of screen changes the image does not fit properly , it shows blank space on both side of screens on large screens. Is there a way with which I can make a standard case which shall run for all screens .

This is how I am setting my div

mheaderimgs {
width:1007px;
margin:auto auto;
height:auto;
}

我正在开发一个网页，其中我在div的帮助下设置背景但我的问题是当分辨率为屏幕更改图像不合适，它在大屏幕的屏幕两侧显示空白区域。有一种方法可以制作一个标准的案例，该案例将在所有屏幕上运行。 p>

这就是我设置div的方法 p>

  mheaderimgs {
width：1007px; 
margin：auto auto; 
height：auto; 
} 
  代码>  pre> 
  div>

答

CSS backckground-size property,

background-size:contain;

for more reference, see

http://www.w3schools.com/cssref/css3_pr_background-size.asp

答

width:100% would strech it, If you make it a slightly bigger image it would shrink it in most cases only making you need 1 image.

As far as Im aware, there is no none-javascript method to get the size of the screen and then compare to set sizes

答

Php doesn't know how big the clients screen is. Consider javascript or Media queries .

答

May be you can try this (CSS3 property) :

background-size: cover;

Otherwise, I think you can do it in javascript.

如何在div中设置不同屏幕分辨率的背景图像？

相关推荐