默认情况下无缩放的元名称视口答案

【问题标题】：meta name viewport with No Zoom by default默认情况下无缩放的元名称视口
【发布时间】：2016-02-04 17:36:51
【问题描述】：

我希望我的网站适合移动设备的屏幕。 没有水平滚动 默认情况下，只有垂直滚动。我将元视口用作：

<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=yes ">

这在移动网络浏览器中不起作用，网站被缩放并显示水平滚动条。用户必须缩小并查看内容。
站点测试模板为waterbill.phed.co.in - meta viewport not working in mobile
如何使用 No Zoom 使网站适应设备宽度？

【问题讨论】：

快速浏览一下，您会发现 #templatemo_footer、#services、#templatemo_welcome 等使用 930 像素的固定宽度。使用百分比和媒体查询重写它们。
改变它们会完全改变设计，有没有其他方法可以做到这一点。通过设置手动宽度？
如何仅使用宽度 % 构建站点，有时我们需要以像素为单位指定宽度以进行准确的设计。如何实现？
您可以将 min-width 和 max-width 与百分比宽度结合使用。关于您之前的问题，您可以使用媒体查询来定位特定设备。例如：在iphone上，宽度可以是400px；
因为它是在mvc4中开发的，并且在mvc4中是捆绑了css的。如何在 mvc4 中做到这一点。我该怎么办？

标签： html css mobile meta-tags meta

【解决方案1】：

您的网站很可能会显示一个水平滚动条，因为某些元素的宽度可能与其他元素的宽度一起超过您可用视口宽度的 100%。在设置水平长度样式时，您需要使用百分比作为单位。请注意，这不仅包括元素的内容框，还包括元素的水平内边距、边框和边距。当然，它们的总和不应超过 100%。此外，使用box-sizing 可能对您有所帮助。

【讨论】：