图像宽度相对于屏幕分辨率

Question

我刚看过这个网站：

http://www.morphix.si/#home

我想知道如何将图像宽度调整为屏幕分辨率？ （换句话说：他们如何安排这样的CSS，所以在每个屏幕上看起来都一样？）

Answer 1

如果您在谈论background-image，那么这是一个CSS3解决方案

background: url(images/image.jpg) no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

此外，如果您有兴趣设计与每个屏幕兼容的布局，您可以使用特定于屏幕分辨率的@media查询，通常用于响应式设计，如

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
  /* Styles goes here */
}