Tag: 视口
视口元标记真的有必要吗？
我已经创build了一些响应式网站，但对响应式网站开发来说却是一个新兴的事情 在我的CSS中，99％的值是以ems或百分比表示的。 我正在使用媒体查询（最大宽度和最大设备宽度）进行布局更改。 我没有包含视口元标记，它可以在iOS，我testing过的许多Android手机和平板电脑以及所有桌面浏览器上完美运行。 添加元标记会破坏我的网站。 我是否做错了什么，或者做了什么正确的事，这样我就不需要包括它了？ 我很困惑，为什么这似乎是一个最好的做法，因为它打破了我的东西。 我错过了什么吗？
我怎样才能强制网站扩展到手机修复（Iphone android ..）
当我加载我的网站在一个iPhone它不缩小。 我所看到的是最左上angular的几百平方像素。 我是手机优化的新手，但是我觉得大多数页面会自动滚动以适应，而且大部分问题似乎都是针对我所面对的情况（强制手机不能缩小比例）。 我想整个页面的宽度是可见的，使用户将不得不放大阅读文本。 我曾尝试过，没有在头上的代码，但没有明显的影响。 <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!– I Also tried: –> <meta name="viewport" content="width=1024, initial-scale=1">
HTML5 Boilerplate：Meta viewport和width = device-width
我正在构build一个自适应/响应式网站。 关于HTML5BP的最近更改： “ 移动/ iOS的CSS修订 ” 我已经开始使用： <meta name="viewport" content="width=device-width"> …我有这个在我的CSS： html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } 当包含initial-scale=1时，从垂直到水平（在iPad / iPhone上）旋转导致布局从2列（例如）改变到3列（由于美达查询， initial-scale=1和JS修复视口缩放错误 ）。 总而言之 ，在横向模式下，缩放页面： <meta name="viewport" content="width=device-width"> …而这不是： <meta name="viewport" content="width=device-width, initial-scale=1"> 注意：在iPad / iPhone上查看HTML5BP网站时，您可以看到这种缩放效果。 我的问题： 这是否成为新的标准（即在横向模式下变焦）？ 我有一段时间向我的同事和老板们解释这个变化……他们习惯于在水平模式下看到不同的布局; 现在页面放大和布局保持不变（除了更大）。 如何向无知的群众解释这个问题的任何提示（其中，我可能会被包括在内）？ @robertc：谢谢！ 这非常有帮助。 我其实不喜欢initial-scale=1 ; 这是我的同事谁习惯看到布局的变化，而不是放大。 我相信我会被迫添加initial-scale=1来取悦每个人（因为没有缩放，看到布局的变化，是他们以前看到的）。 我刚刚注意到github上的HTML5BP index.html和网站 ，使用<meta name="viewport" content="width=device-width"> ; 对我来说，这是足够好的原因，以消除initial-scale=1 ，但当我试图向“非极客”解释这些事情时，我感到很惊讶。 […]
缩放到适合的视口元属性有什么作用？
我很难find这个文件。 它是特定于Safari吗？ 在iOS 9（ 这里 ）有一个最近的错误，解决scheme是添加shrink-to-fit=no的视口元。 这段代码是做什么的？
在iPad / iPhone上纵向和横向之间翻转时，响应式网站会放大
我在这里使用Twitter Bootstrap构build了一个响应式网站：http: //zarin.me/cce/ 响应式devise在iPad和iPhone上效果很好，但是当我将设备从纵向翻转到横向时，网站被放大而不是适应屏幕（捏住屏幕）。 我错过了什么？ 这是一个视口问题吗？ 这是我在我的唯一的视口代码： <meta content="width=device-width, initial-scale=1.0" name="viewport"> 提前致谢！
以跨浏览器的方式查找视口的确切高度和宽度（无Prototype / jQuery）
我试图find浏览器的视口的确切高度和宽度，但我怀疑Mozilla或IE给我错误的数字。 这是我的身高的方法： var viewportHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; 我还没有开始宽度，但我猜这将是类似的东西。 有没有更正确的方式获取这些信息？ 理想情况下，我希望该解决scheme也可以与Safari / Chrome /其他浏览器一起使用。
什么是在HTML中的视口。
什么是HTML中的视口？ 你可以举一些如何访问视口细节的例子吗？
在移动网站上禁用缩放
我想在移动设备上禁用捏和缩放。 我应该把什么configuration添加到视口？ 链接： http : //play.mink7.com/n/dawn/
从纵向到横向旋转时，iPad的布局会扩大
我有一个添加到"viewport"元标记"width=device-width,initial-scale=1.0"和在iPad的页面加载罚款横向模式，它很好地切换到肖像，当我把它旋转回风景它缩放页面，我不得不捏缩放到1规模。 我可以通过添加"maximum-scale=1.0, user-scalable=no"来解决这个问题，但是我想知道是否有一种方法可以解决这个问题，而不需要从用户那里放大页面的能力。 如果您有任何build议，我很乐意听到他们， 谢谢！
Overflow-x：hidden不会阻止移动浏览器中的内容溢出
我在这里有一个网站。 在桌面浏览器中查看，黑色菜单栏正确地只延伸到窗口的边缘，因为body具有overflow-x:hidden 。 在任何移动浏览器中，无论是Android还是iOS，黑色菜单栏都会显示其全宽，这会在页面的右侧留下空白。 据我所知，这个空格甚至不是html或body标签的一部分。 即使我在<head>中将视口设置为特定的宽度： <meta name="viewport" content="width=1100, initial-scale=1"> 该网站扩大到1100px，但仍然有超过1100的空白。 我错过了什么？ 我如何保持视口1100，并切断溢出？
