如何“缩小”大型HTML页面

Question

我有一个宽度为2400像素的静态网页（HTML和CSS）。您可能已经猜到，这将超过大多数典型的屏幕分辨率。一种可能的解决方案是将代码完全重构为＆＃34; scale＆＃34;页面向下到例如1200像素。但是，考虑到我还需要缩小相关图像，这听起来相当痛苦。

是否有（更简单的）方法将此页面缩放到特定宽度？高度也应相应调整。

换句话说，如果我有一个2x乘2的页面，如何将其缩小到例如x-by-y维度？

感谢。

Answer 1

您可以将样式表转换为scss css预处理器。我认为最简单的方法是如果您的样式表是用（sass / scsss，stylus）编写的，那么为宽度和高度设置变量会更容易。

否则您可以使用@media查询

@media (min-width: 1000px) {

/* CSS styles for viewports 1000px and up */  

} 
@media screen and (min-width: 768px) {
/* set the width and height */
 }