所以，我一直在努力让我的网站在手机上工作，我正在使用网格，但是一旦我试图在手机上查看它，它看起来很糟糕。
我只想将桌面版缩小到手机尺寸的一半。
我一直在尝试旧的zoom:0.5;和transform:scale(0.5);，但是没有任何可以接受的结果，我知道如何解决这个问题吗？
我现在正在使用<meta name="viewport" content="width=device-width, initial-scale=1" />，但我也试过了。{
这是指向该网站的链接：http://7b772c72.ngrok.io/wordpress/
我的网格：https://github.com/joelfolkesson/jf/blob/master/style.css
答案 0 :(得分：0)
缩小内容很可能会导致在较小的视口上出现难以辨认的网站。
您可以尝试使用media queries为您的网站为您的网站提供所述media queries中定义的尺寸的适当比例。
如果您没有投入太多时间，我建议使用Twitter Bootstrap，因为它已经拥有了不错的跨设备CSS，可以实现快速轻松的移动友好部署。
您可以查看使用Twitter Bootstrap构建的this site。
<强>更新 您希望保持布局与移动桌面视图相同。但如上所述，该文本将在移动视图端口上变得难以辨认，而这种情况就是如此。
我建议您更改管理菜单和徽标的CSS媒体查询，并将其大小增加到可在移动视图中阅读，而不是使用 zoom：0.5; 。
将移动视图的徽标大小更改为大约75％，并将菜单项更改为100％宽度，或尝试使用不同的定义样式，并将它们放在宽度为33.3％的3网格和菜单中应分成上下两个部分或将网格更改为6，宽度为16.6％，并将它们彼此相邻放置并减少填充以允许更大的文本。
除此之外，由于样式表命名约定对我来说非常混乱，我无法提供更多帮助。