问题标签 [initial-scale]

所以我现在很困惑。我正在使用 Delicate 主题构建一个响应式网站。它内置了元标记

我的印象是将整个内容设置在屏幕宽度上。在我的手机上，我必须缩小才能使内容显示得很好。我尝试将初始比例值更改为 0.65，这使得该网站在我用来开发的个人手机上看起来不错，但在 iphone 6 或其他设备上效果不佳。

我一直在把脸撞在墙上，所以任何建议都将不胜感激

如果我将以下元标记添加到我的移动网页，则垂直方向的块级元素之间会有额外的空间。

<meta name="viewport" content="initial-scale=1.2,user-scalable=no" id="metaViewwport">

如何解决问题？

完整代码：

我想根据设备调整视口缩放（初始比例） - 平板电脑放大更大，手机肖像模式缩小。

我可以通过<meta name="viewport"...index.html 控制缩放，但这并不特定于每个设备。

有没有办法通过@media 查询来控制缩放？

他们似乎没有任何效果。

我有以下CSS：

我的理解是第一个（320px），应该是手机纵向模式，第二个应该是平板纵向模式，第三个应该是平板横向。

在任何一种情况下，结果都不会改变。

我正在三星 Galaxy Tab E 和 htc M8 One 手机上进行测试。

任何见解都值得赞赏。

谢谢。

我是一个尝试制作响应式网站的初学者。我阅读了这篇文章https://css-tricks.com/snippets/html/responsive-meta-tag/并遵循了 W3Schools 的提示，但我仍然对initial-scale=1.0. 我还阅读了与此问题相关的 Stack Overflow 问题。我的声誉太低，无法添加更多问题作为评论 - 这就是我问的原因。

我看不出这之间的区别：

和这个：

我在许多浏览器中测试了这些代码片段，我无法确定哪些代码更好以及为什么。如果我省略initial-scale=1.0浏览器会以某种方式为我添加它吗？看起来他们会的。

我知道有几种方法可以扩展我的网站。但我什至找不到基于基本宽度缩放页面的智能方法。比如说，我已经针对特定宽度优化了我的移动网站，并且针对页面的所有其他宽度进行了缩放。我可以将我的基本宽度设置为 640 像素 - 如果访问者视口为 640 像素，则元素不会缩放。如果访问者视口为 1000ox，则元素应按 1.5625 倍（1000px/640px）缩放。什么是实现这一目标的聪明方法。是的，我可以运行 JS 来获取视口并计算宽度，但我更喜欢 CSS 解决方案——比如在类中设置参数和乘以宽度。谢谢并恭祝安康 ：）

此代码工作准确。但是当我使用此元标记时，不会保持响应：

必须在代码中包含 initial-scale=1.0

HTML

CSS

JavaScript

请查看此代码并帮助我做出响应。

必须包括 initial-scale=1.0

当 initial-scale=0.6,minimum-scale=0.6 和 maximum-scale-0.6 内容在 iphone X 和 iphone 11 chrome 浏览器中溢出，但在 safari 中有效，也适用于没有缺口的设备，问题仅在有缺口的 chrome 浏览器中iphone 设备。有没有办法解决？因为我希望桌面设计适合这个我给初始比例= 0.6 的横向模式，以便它可以适应桌面设计。