草庐IT

Viewport3

全部标签

html - 隐藏/显示地址栏时,在 Chrome iOS 上垂直显示内容 "jumps",并调整视口(viewport)大小

关闭。这个问题需要debuggingdetails.它目前不接受答案。编辑问题以包含desiredbehavior,aspecificproblemorerror,andtheshortestcodenecessarytoreproducetheproblem.这将有助于其他人回答问题。关闭3年前。Improvethisquestion我的网站上有不同的部分,我希望其中一些部分占据整个视口(viewport)高度。所以我用height:100vh;调整大小在ChromeiOS上,每当隐藏或再次显示地址栏时,这会导致内容略微“垂直跳跃”。特别是,每当用户向一个方向滚动然后向另一个方向滚动

iphone - 视口(viewport)元标记不适用于 iPhone

我的网站有一个固定的布局,大小为1090像素。当我使用这个元标记时:页面将加载放大。虽然不是所有的方式(大约300像素的宽度不在视野范围内)。此外,您无法将页面缩小到足以看到整个页面的程度。width=device-width不应该解决这个问题吗?所以我尝试了0.29的初始比例,这对iPhone来说效果很好。但是当在iPad上加载网站时,它显然太小了。我该如何解决这个问题?更新:所以我只是想,宽度似乎是由我的页面的高度定义的。iPhone上的Safari适合视口(viewport)中的高度而不关心适合宽度,也不会让您缩小以查看整个宽度。看起来如果页面更高,您可以看到更多的宽度。横向宽度

ios - 即使视口(viewport)元标记中的分辨率宽度为 1536,ipad 3 设备宽度是否始终为 768?

我正在尝试了解iOS设备的视口(viewport)元标记。我创建了一个测试页面,我在其中插入了一张862像素宽的图像。所以我将视口(viewport)元标记设置为:然而在ipad3上,分辨率宽度为1536像素,视口(viewport)设置为与ipad3相同的可见区域,862px的图像被放大了,宽度比可见区域。所以我必须水平滚动才能看到图像的其余部分。这让我觉得device-width返回768像素,这说明了862像素图像的水平滚动有点额外。为什么要这样做?我必须考虑某种像素密度吗?更新我已经尝试将宽度设置为数字宽度,与图像的宽度完全相同(在本例中为“862”)。所以网页是862X206

android - PhoneGap 忽略设置了特定宽度的视口(viewport)标签?

我开发了一个web应用程序,并成功地使用视口(viewport)元素使该应用程序适合不同的设备。例如在iPhone上我使用了这个:我的Web应用程序在iPhoneSafari浏览器上使用此视口(viewport)看起来不错。因此我想,在PhoneGap的帮助下将我的webapp包装成AppStore应用程序会很容易。但到目前为止,我没有运气这样做。viewport标签似乎被完全忽略了。所以这是我的问题:视口(viewport)标记是否在PhoneGap上以特定宽度(如上例所示)工作?还是我必须重新设计响应式网页设计? 最佳答案 我已

iphone - "Viewport"由 HTML 中的 META 标记...如果 iPad = X 并且如果 iPhone = Y?

在iPad上运行良好,但在iPhone上运行不佳任何代码都可以指向iPad和iPhoneiPadiPhone 最佳答案 iPhone最大宽度是480px而不是440px这将关闭可缩放选项的视点这是一个仅适用于iPad的css文件这是一个仅适用于iPhone的css文件它们是条件注释,因此它们将仅适用于具有指定最大宽度的特定设备。 关于iphone-"Viewport"由HTML中的META标记...如果iPad=X并且如果iPhone=Y?,我们在StackOverflow上找到一个类似

iOS 忽略元视口(viewport) width=device-width, initial-scale=1.0

当我在iPhone中使用Safari查看以下html文件时,它没有按预期显示内容的整个宽度:iOSViewportTestbody#wrap{width:1008px;border:1pxsolid#000;}h1{font:30pxsans-serif;}Here'ssomequiteeloooongatedtextthatshouldmakethescreenatleast1008pxwideormore谁能看出我做错了什么?物有所值,我有iOS6.1和Safari6.0 最佳答案 尽管我非常仔细地阅读了苹果的各种视口(view

javascript - 想要在激活 iOS 键盘时调整浏览器视口(viewport)的大小

在iOS网络浏览器(Safari、Chrome等)中,当您点击输入字段并显示键盘时,它会保持视口(viewport)大小不变,但会向上滑动部分不在视野范围内。这使得创建类似应用程序的网站变得非常困难,因为我正在编写一个聊天应用程序,当键盘显示时我想保持对话完全可见,但只需调整对话区域的大小以适应新的“调整大小”的可视区域。我已经尝试了所有方法,例如让对话区域绝对定位left:0;右:0;顶部:0;bottom:0,但iOS仍然保持视口(viewport)大小相同并将其向上推,部分超出View。这可能吗?还是超出CSS或JavaScript控制的系统级功能?

iphone - PhoneGap : Scaling down a webpage with viewport

我正在创建我们将在工作中构建的应用程序的快速原型(prototype),以便我们可以对某些功能进行快速用户测试。我的设计师以640像素的宽度创建了我的图像,以匹配iPhone5的分辨率。因此,为了让事情变得简单快捷,我使用了这个视口(viewport)标签:这在移动版Safari中完美运行,但现在我将其包装在PhoneGap中,它的行为就像比例设置为1。关于我需要做些什么来解决这个问题有什么想法吗?谢谢。 最佳答案 我找到了。项目的根目录中有一个“config.xml”。设置这一行:要像我这里的代码片段显示的那样“真实”,使应用程序

javascript - 如果 div 在视口(viewport)之外,我如何将它们设置为 "visibility:hidden"

我正在开发移动网络应用程序。但是,iOS5.1或以下版本的safari内存有限。当我使用css3转换时,我需要最小化内存使用。我发现如果我使用css样式“display:none/visibility:hidden”,应用程序不会因内存问题而崩溃。所以我想在它们真正隐藏的时候让它们“隐藏”起来。我的英语不好。图片可以显示我想要的:上传图片**:**另一个网站示例使用css“visibility:hidden”属性在不在屏幕上时隐藏每个session:examplewebsite:DentsuNetwork 最佳答案 有一个plugi

使用viewport-fit=cover来解决关于ios在Safari浏览器内容被地址栏、菜单栏或工具栏遮挡导致的兼容问题

文章目录前言一、viewport-fit1.作用2.取值3.使用二、使用css的env()和constant()函数用于设定安全区域与边界的距离1.iPhone手机的安全区域(如下图)2.由来、作用3.使用4.语法5.兼容问题三、解决ios内容被Safari遮挡的两种情况1.顶层div的height:100vh2.顶层div的height:100%1.height:100%为什么会没有填充整个页面2.顶层div的height:100%的时候,这个时候你设置的env/constant的话应该将页面限制在安全区域内总结补充——新的视口单位前言首先,本文将会详细说明一下如何使用viewport-fi