问按比例从psd实现页面

EN

我通常将其一分为二。我的意思是，在这种情况下，网站的尺寸是875x1200。因此对于每个规格，比如字体、块宽度、图像宽度都应该分成2块。

例如，标题字体大小为42px，那么您可以应用21px。

对于图像，您可以通过指定首选项的宽度和高度，完全使用CSS来完成此操作。浏览器将调整图像的大小(但如果您没有选择正确的纵横比，图像看起来可能会明显放大或压缩)。

img {
 height: 300px; //whatever height you want
 width: 200px //whatever width you want
}

对于响应式布局，您可以使用CSS3媒体查询来实现不同分辨率的最佳外观。

响应式布局示例：

img {
  height: 100%;
  width:100%
}

@media screen and (max-width:64em) {
  height: 70%;
  width: 70%
}

至于字体大小，有时你可能不得不牺牲像素的完美，以获得最佳的外观，并自行决定字体是否适合显示。

这也可以通过使用媒体查询来控制：

@media screen and (max-width: 32em) {
  font-size: 1.5em
}