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

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 */
}