Question

我有一个我做过的网站（没有引导或任何或那些东西，我有一个问题，试图为屏幕分辨率较小的人缩小一切。基本上我会希望它检测大小，并且将适当的CSS类应用于元素，以便在特定宽度下缩小所有内容。现在我只是尝试构建CSS类，我遇到了一些困难。我得到的最接近的是缩小所有内容： / p>

transform: scale(.75);

这对于调整大小的实际内容非常有用，但是我在内容周围留下了一个大的填充字段。有点难以解释，但我想要的是内容缩小，但div仍然是浏览器的100％（所以如果有一个较小的浏览器，它很适合没有围绕内容的这个愚蠢的大填充区域）< / p>

通常看起来如下： image!

以下是添加CSS转换后的外观：image2!

如何克服这一点的任何想法将不胜感激，另请注意我真的不关心我的解决方案不能在IE9或更低版本中工作！

我想要的基本输出是将浏览器缩放缩小到75％的平均值，如果有帮助的话......

Answer 1

根据CSS的编写方式，可以使用简单的方法：

@media only screen and (max-width: 600px) {
    body {font-size: 85%;}
}

如果您的宽度为em的div会缩小宽度，但您可以通过上面的媒体查询更改，也许可以将宽度设置为100%等。