草庐IT

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

coder 2023-09-28 原文

我正在尝试了解 iOS 设备的视口(viewport)元标记。我创建了一个测试页面，我在其中插入了一张 862 像素宽的图像。所以我将视口(viewport)元标记设置为:

<meta name="viewport" content="width=device-width,  initial-scale=1.0, minimum-scale: .5, maximum-scale: 5.0">

然而在 ipad 3 上，分辨率宽度为 1536 像素，视口(viewport)设置为与 ipad 3 相同的可见区域，862px 的图像被放大了，宽度比可见区域。所以我必须水平滚动才能看到图像的其余部分。

这让我觉得 device-width 返回 768 像素，这说明了 862 像素图像的水平滚动有点额外。为什么要这样做？我必须考虑某种像素密度吗？

更新

我已经尝试将宽度设置为数字宽度，与图像的宽度完全相同(在本例中为“862”)。所以网页是 862X206，与图像相同，但它与将宽度设置为设备宽度完全相同。

更新 2

我创建了一个非常简单的页面，由于某种原因，一个视口(viewport)为 862 像素的空白页面导致我的 ipad 3 出现水平和垂直滚动，代码:

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=862, initial-scale=1.0">
</head>

<body style="width:100%; padding:0; margin:0">

</body>
</html>

这种滚动导致视口(viewport)不适合可视区域或屏幕尺寸。我不明白。任何见解将不胜感激。谢谢你。 ** 注意 ** 我忘记将填充和边距重置为 0，它添加了 8 像素的边距。

更新 3

好吧，本来我以为device-width会返回ipad 3的1536像素的分辨率宽度，显然，它返回的是768像素的屏幕尺寸。

任何大于 768 的视口(viewport)宽度都会让我在 iPad 3 上滚动。为什么？如果你有一个 1024 像素的页面，并且你想将它放入 ipad 3 的可见区域怎么办？你将宽度设置为 1024，将初始比例设置为 1，这不应该使 1024px 视口(viewport)适合可视区域？

解决方案

好吧，如果你想让每个设备都知道如何缩放你的页面，你所做的就是省略初始缩放。

因此，如果我只设置宽度，使用设备宽度或数值，而忽略初始比例，它会自动为您计算缩放比例。它只是工作。

我的困惑在于宽度是什么意思，宽度是指应用比例之前的宽度， 所以如果我说:

<meta name="viewport" content="width=device-width,  initial-scale=1.0, minimum-scale: .5, maximum-scale: 5.0">

缩放前视口(viewport)的宽度是，768，如果网页主体是862px，应用1.0的缩放因子后，内容乘以1.0，862*1.0，所以宽度viewport 现在内容的宽度以该比例因子 862px 缩放。我希望我理解这一点。这就是我的困惑所在，宽度是什么意思。

最佳答案

iPad 3 的宽度为 768 像素，其中每个像素代表 2 个物理像素。您可以在 Javascript 中考虑它，但据我所知不能在您的视口(viewport)中考虑(而且您可能不想这样做，因为这些 768 像素与早期 iPad 上的物理尺寸相同)。

关于ios - 即使视口(viewport)元标记中的分辨率宽度为 1536，ipad 3 设备宽度是否始终为 768？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15954953/

viewport即使strongsectioniosmeta-tagsipad-3metatag

有关ios - 即使视口(viewport)元标记中的分辨率宽度为 1536，ipad 3 设备宽度是否始终为 768？的更多相关文章

  1. ruby - 即使失败也继续进行多主机测试 - 2

    我已经构建了一些serverspec代码来在多个主机上运行一组测试。问题是当任何测试失败时，测试会在当前主机停止。即使测试失败，我也希望它继续在所有主机上运行。Rakefile:namespace:specdotask:all=>hosts.map{|h|'spec:'+h.split('.')[0]}hosts.eachdo|host|begindesc"Runserverspecto#{host}"RSpec::Core::RakeTask.new(host)do|t|ENV['TARGET_HOST']=hostt.pattern="spec/cfengine3/*_spec.r

  2. ruby - 如何验证 IO.copy_stream 是否成功 - 2

    这里有一个很好的答案解释了如何在Ruby中下载文件而不将其加载到内存中:https://stackoverflow.com/a/29743394/4852737require'open-uri'download=open('http://example.com/image.png')IO.copy_stream(download,'~/image.png')我如何验证下载文件的IO.copy_stream调用是否真的成功——这意味着下载的文件与我打算下载的文件完全相同，而不是下载一半的损坏文件？documentation说IO.copy_stream返回它复制的字节数，但是当我还没有下

  3. Ruby 文件 IO 定界符？ - 2

    我正在尝试解析一个文本文件，该文件每行包含可变数量的单词和数字，如下所示:foo4.500bar3.001.33foobar如何读取由空格而不是换行符分隔的文件？有什么方法可以设置File("file.txt").foreach方法以使用空格而不是换行符作为分隔符？ 最佳答案 接受的答案将slurp文件，这可能是大文本文件的问题。更好的解决方案是IO.foreach.它是惯用的，将按字符流式传输文件:File.foreach(filename,""){|string|putsstring}包含“thisisanexample”结果的

  4. 【鸿蒙应用开发系列】- 获取系统设备信息以及版本API兼容调用方式 - 2

    在应用开发中，有时候我们需要获取系统的设备信息，用于数据上报和行为分析。那在鸿蒙系统中，我们应该怎么去获取设备的系统信息呢，比如说获取手机的系统版本号、手机的制造商、手机型号等数据。1、获取方式这里分为两种情况，一种是设备信息的获取，一种是系统信息的获取。1.1、获取设备信息获取设备信息，鸿蒙的SDK包为我们提供了DeviceInfo类，通过该类的一些静态方法，可以获取设备信息，DeviceInfo类的包路径为：ohos.system.DeviceInfo.具体的方法如下：ModifierandTypeMethodDescriptionstatic StringgetAbiList​()Obt

  5. Get https://registry-1.docker.io/v2/: net/http: request canceled while waiting - 2

    1.错误信息：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:requestcanceledwhilewaitingforconnection(Client.Timeoutexceededwhileawaitingheaders)或者：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:TLShandshaketimeout2.报错原因：docker使用的镜像网址默认为国外，下载容易超时，需要修改成国内镜像地址（首先阿里

  6. [工业相机] 分辨率、精度和公差之间的关系 - 2

    📢博客主页：https://blog.csdn.net/weixin_43197380📢欢迎点赞👍收藏⭐留言📝如有错误敬请指正！📢本文由Loewen丶原创，首发于CSDN，转载注明出处🙉📢现在的付出，都会是一种沉淀，只为让你成为更好的人✨文章预览：一.分辨率（Resolution）1、工业相机的分辨率是如何定义的？2、工业相机的分辨率是如何选择的？二.精度（Accuracy）1、像素精度（PixelAccuracy）2、定位精度和重复定位精度（RepeatPrecision）三.公差（Tolerance）四.课后作业（Post-ClassExercises）视觉行业的初学者，甚至是做了1~2年

  7. 即使安装了 gem，Ruby 也找不到所需的库 - 2

    我花了几天时间尝试安装ruby​​1.9.2并让它与gems一起工作:-/我最终放弃了我的MacOSX10.6机器，下面是我的Ubuntu机器上的当前状态。任何建议将不胜感激!#rubytest.rb:29:in`require':nosuchfiletoload--mongo(LoadError)from:29:in`require'fromtest.rb:1:in`'#cattest.rbrequire'mongo'db=Mongo::Connection.new.db("mydb")#gemwhichmongo/usr/local/rvm/gems/ruby-1.9.2-p0/g

  8. ruby-on-rails - 禁用设备的 :confirmable on-the-fly to batch-generate users - 2

    Devise是一个Ruby库，它为我提供了这个User类:classUser当写入:confirmable时，注册时会发送一封确认邮件。上周我不得不批量创建300个用户，所以我在恢复之前注释掉了:confirmable几分钟。现在我正在为用户批量创建创建一个UI，因此我需要即时添加/删除:confirmable。(我也可以直接修改Devise的源码，但我宁愿不去调和它)问题:如何即时添加/删除:confirmable？ 最佳答案 WayneConrad的解决方案:user=User.newuser.skip_confirmation

  9. ruby - 为什么不能使用类IO的实例方法noecho？ - 2

    print"Enteryourpassword:"pass=STDIN.noecho(&:gets)puts"Yourpasswordis#{pass}!"输出:Enteryourpassword:input.rb:2:in`':undefinedmethod`noecho'for#>(NoMethodError) 最佳答案 一开始require'io/console'后来的Ruby1.9.3 关于ruby-为什么不能使用类IO的实例方法noecho？，我们在StackOverflow上

  10. ruby-on-rails - 即使没有挂起的迁移，Rails 迁移也非常缓慢 - 2

    我的生产Rails应用程序需要167秒来运行rakedb:migrate。可悲的是，没有要运行的迁移。我试图在检查是否有待处理的迁移时调整运行的迁移，但随后检查花费了同样长的时间。我心目中唯一的“借口”是数据库并不小，那里有1M条记录，但我看不出这有什么关系。我查看了日志，但没有任何迹象表明出了什么问题。我在运行ruby2.2.0rails4.2.0有没有人知道为什么会这样，是否有什么办法可以解决？ 最佳答案 运行rakedb:migrate任务还会调用db:schema:dump任务，这将更新您的db/schema.rb。因此，即

随机推荐