程序员经验分享-hwhale

1024px宽度的屏幕和1024px宽度的平板电脑是冲突的

2024-03-21

我正在使用 MediaQuery 创建响应式网站布局，如下所示，除了一个邪恶的问题外，一切正常！

core.css 默认应用于站点，它是桌​​面版本的样式表。但正如您在此链接中看到的，当屏幕宽度为 1024px 或以下时，它将链接到 table-and-mobile.css，以便它应用平板电脑和手机样式。<link rel="stylesheet" type="text/css" media="screen and (max-width : 1024px)" href="assets/css/tablet-and-mobile.css"/>

问题是，许多用户仍然使用屏幕宽度为 1024px 的桌面，而平板电脑宽度也是 1024px！事实上，两个屏幕具有相同的宽度，这与整个系统发生冲突，因为当从宽度为 1024px 的屏幕桌面访问网站时，它会应用平板电脑版本。

@media screen and (max-device-width: 1024px)

我已经尽力了！但似乎无法修复它。你会推荐什么？这是一个实时模板：www.loaistudio.com


您可以尝试以下操作：@media screen and (max-width: 1024px) and (min-resolution: 120dpi)此 MQ 应该适用于大多数平板电脑，但不适用于屏幕大于 10.5 英寸的笔记本电脑，这涵盖了大多数情况。这不是一个理想的解决方案，但值得一试。DPI 计算器可能有帮助 http://members.ping.de/~sven/dpi.html.

对于您的情况可能如下所示：<link rel="stylesheet" media="screen and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 1.25),(min-resolution: 120dpi)" href="assets/css/tablet-and-mobile.css" />

注意：请参阅 -https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries#resolution https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries#resolution

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

jQuery

html

css

mediaqueries

1024px宽度的屏幕和1024px宽度的平板电脑是冲突的 的相关文章

  • Google Chrome 上的 xsl:include 和 xsl:param，带有 jQ​​uery 转换插件

    我一直尝试在 Google Chrome 中使用 XSL 但没有成功 我读到 Chrome 在 XSLT 方面存在一些错误 其中之一是它不支持 xsl include 可以在这里检查错误 http code google com p chr

  • 使用 .add() 选择多个 jQuery 对象

    是否 add http api jquery com add 方法允许一次选择多个对象而不是一次添加一个 one add two add three add four on click function 以下变量的设置方式相同 因为每个变量

  • 如何在 Mac 的任何 webkit 中隐藏父圆角的画布内容？

    我有一个父母div带有圆角 其中包含canvas div div

  • 垂直对齐两个弹性项目[重复]

    这个问题在这里已经有答案了 我有一个弹性容器 container和两个弹性项目 item one and item two 我想将第一个项目垂直居中并将第二个项目粘在底部 我不知道如何在这种情况下垂直对齐第一项 HTML div class

  • IE10中的图像插值

    这是我的用例 我有一个采用响应式设计的网页 该页面垂直分成两半 我想在右侧显示图像 呈现为 PNG 或 JPG 的 PDF 页面 调整窗口大小后 图像的大小应立即更改 我以为我已经解决了这个问题 我将服务器上的图像渲染得足够大 以适应最大可

  • Mobile Safari (iPhone) CSS 垂直居中/行高 CSS 问题

    有一个问题 我一直试图在各个项目中解决 但运气不佳 我有一些divs 内的文本以 CSS 为中心 使用display block and line height 我也尝试过padding和固定的高度 通常 这些设置要么只是标题 要么有时是按

  • asp.net 将值从 JS/jquery 传递到 C# 背后的代码

    我已经尝试了 所有 可能的方法 将 screen width vlaue 从 aspx 页面上的 JS 脚本发送到后面代码中的 c 虽然我可以看到 screen width 被正确分配 但它永远不会分配给我的隐藏字段价值

  • SAPUI5 等待延迟对象 // 等待 .done() 函数

    我知道有几个线程对此进行讨论 但我认为在 SAPUI5 上下文中没有线程回答有关 SAPUI5 中的延迟 同步调用的一般主题 在我的控制器中我得到 test function var dfd Deferred var sServiceUrl

  • 如何在 HTML 表格上使用分页？

    我正在尝试使用这个分页library http flaviusmatis github io simplePagination js 在我的 HTML 表格页面 特别是浅色主题 中 但不知何故 我无法理解如何在我的 HTML 页面中以这种方

  • 将字符串（是一个函数）转换回 Javascript 中的函数

    我在下面将此函数作为字符串 我如何将其转换回函数 我正在从 JQuery 事件中提取事件处理程序 我想将它们存储为字符串 然后将它们转换回来 因为它们将保存在 mySQL 中 function if GActiveClick return

  • 从 html5

    我正在寻找一种方法来根据用户代理字符串将控件属性添加到视频标签 我不希望在 iPad 和 Android 之外的任何浏览器或设备上出现控件属性 所以我认为用户代理是最好的识别方法 因为 ipad 和 android 一词出现在各自的 UA

  • 在 R Shiny 中，如何使用可排序 js 将其在列表中出现的顺序次数附加到每个列表元素？

    下面的可重现代码适用于将元素从一个面板拖动到另一个面板 并在 拖动到 面板中自动使用 HTML CSS 对拖入的每个元素进行排名顺序编号 但是 我现在尝试附加到每个 拖动到 列表元素的末尾 使用某种形式的paste0 我假设 该元素在 拖至

  • Gmail 和 Google Chrome 12+ 中的“从剪贴板粘贴图像”功能如何工作？

    我注意到一个来自 Google 的博文 http gmailblog blogspot com 2011 06 pasting images into messages just got html其中提到 如果您使用的是最新版本的 Chro

  • iPhone 点击时使 div 变暗

    当您的 div 附加了点击处理程序时 当点击该 div 时 iPhone 会使该 div 变暗 作为点击指示器 示例 在移动 Safari 上查看http jsbin com awejo3 4 http jsbin com awejo3 4

  • CSS：理解和调整字体的行距/行高

    有人问了一个非常相似的问题here https stackoverflow com questions 13701110 css remove line height leading on larger text但确实回答得足够了 CSS

  • CSS 动画自定义属性/变量

    一段时间以来我一直在努力让它发挥作用 关键是内部 div 将具有某种形状 并且可能会不止一个 这就是为什么我使用nth child选择器 这个内部 div 应该显示然后再次隐藏一段时间 问题是 我想在一个动画中为所有 后来的 多个内部 di

  • 如何在具有现有记录的 json 数据表顶部添加新行

    我试图在数据表顶部添加一行 显示 金额 列的总和 我正在使用 json 数据表 jquery 插件 列表来显示数据表 如何将此行与现有行一起添加到数据表顶部 我认为这段代码会对你有所帮助 var json uid user123 first

  • 在firefox上用js改变表单方法

    我需要使用 javascript jQuery 或纯 更改表单的方法属性 我的表单有 method post 我尝试用以下方法更改它 submit button click function var url input id url val

  • JsGrid 将嵌套对象加载到表中

    我正在 Django 中开发一个 Web 项目并使用 jsGrid 我遇到了问题并且找不到解决方案 我有一个嵌套的 JSON 数据 它是通过组合多个数据库表记录创建的 这是我的 JSON count 3 results personnel

  • 用 Beautiful Soup 进行抓取：为什么 get_text 方法不返回该元素的文本？

    最近我一直在用 python 开发一个项目 其中涉及抓取一些网站的一些代理 我遇到的问题是 当我尝试抓取某个知名代理站点时 当我要求 Beautiful Soup 查找 IP 在代理表中的位置时 它并没有按照我的预期执行操作 我将尝试查找每

随机推荐

  • Android：使用 MotionEvent 在自定义 ViewGroup 中对视图进行拖放定位

    我在创建的自定义 ViewGroup 上定位视图元素时遇到问题 特别是在拖放情况下 我的目标是 Android 2 2 及更高版本 因此我无法真正使用 Android 3 中出现的拖放 API 我的自定义 ViewGroup 称为 Node

  • 如何一般性地比较整个java bean？

    我一直在尝试使用 org apache commons beanutils 库来获取方法 习惯用法来评估相等性all两个实例之间的属性 即 bean 的通用 equals 方法 有没有一种简单的方法可以使用这个库来做到这一点 或者我以错误的

  • MySQL - 将用户排在最高分列表中

    我有一个 MySQL 查询 它选择我的成绩中排名前 3 的球员users表 然后创建一个额外的列 其中分配了它们的排名 SELECT s curRank curRank 1 AS rank FROM users AS s JOIN SELE

  • 如何在 SQL 中更新/插入指定日期范围内的随机日期

    请原谅我 我是一个绝对的新手 我需要 phpmyadmin 中这张表的帮助 我的表有以下列 Primary ID Begin Date End Date Timestamp 如何在 phpmyadmin 中更新具有指定日期范围 例如 一个月

  • 在 C++ 纯虚函数上应用“using”关键字

    B 类重写了 A 类的纯虚函数 print C 类继承了 B 类并具有 using A print 语句 那么为什么 C 类不是抽象类呢 class A public virtual void print 0 class B public

  • 仅在多索引中的第二个索引上使用 .loc

    我有多索引数据框 如下所示 value year name 1921 Ah 40 1921 Ai 90 1922 Ah 100 1922 Ai 7 其中year and name是指数 我想选择名称所在的每一行Ai出现 我努力了df loc

  • 通用 C++ 多维迭代器

    在我当前的项目中 我正在处理多维数据结构 底层文件按顺序存储 即一个巨大的数组 没有向量的向量 使用这些数据结构的算法需要知道各个维度的大小 我想知道是否已在某处以通用方式定义了多维迭代器类 以及是否有任何标准或首选方法来解决此问题 目前

  • 如何在 Kendo 菜单中检索 id 值

    我在我的项目中使用 Kendo 菜单 我想在单击所选项目时检索 id 值 我使用了 onSelect 事件 并且能够检索所选项目的文本 如何检索 id 值 您可以使用 HTML5 数据属性来完成此操作 HTML div class k co

  • python多处理池解释器中的断言错误

    我正在编写一个示例程序来测试 python 2 7 2 中工作线程多处理池的使用情况 这是我在 python ubuntu 解释器中编写的代码 gt gt gt from multiprocessing import Pool gt gt

  • Swift：guard let 和 where - 优先级

    有时 我想用guard结合let where简化我的代码 但我想知道 let 的优先级是什么以及在哪里 例如 class Person func check gt Bool print checking return nil func te

  • 无可用服务器时的 Serilog 和 seq

    当使用 Serilog 和 Seq 的应用程序找不到将日志发送到的服务器时 预期的行为是什么 每次尝试记录都会抛出异常吗 我希望我的应用程序使用 Seq 服务器 如果可用 但如果不可用 仍继续运行并记录到文件 当使用 Serilog 和 S

  • 为什么 Pry 不能在 Heroku 的控制台中运行？

    我的目标是使用 Pry 作为我的 Rails 应用程序的控制台 无论是在本地还是在我的临时服务器上 但我无法让它在 Heroku 上工作 我正在跟进these https github com pry pry wiki Setting up

  • 如何从 Xcode 项目中删除 cocoa pods 插件之一

    有人知道如何从 Xcode 项目中删除 cocoa pods 插件之一吗 例如我已经安装了afnetworking and nyximagekit在我的项目中 现在 我想删除nyximagekit但保留afnetwoking 怎么做 从 p

  • 为什么在 Fortran 中使用命令 PRINT 会覆盖输入文件？

    我正在编写代码并使用 Fortran 中的输入和输出功能 代码看起来像这样 仅用于简化 PROGRAM TEST REAL DIMENSION 1000 A REAL B INTEGER T Defining input and outpu

  • 获取文件系统限制

    我想编写一个函数来告诉我是否可以将文件 文件夹写入特定路径 我想这样做而不实际将任何文件写入磁盘 有 WINAPI 函数吗 感谢您的帮助 您可以使用获取文件安全性 http msdn microsoft com en us library

  • opencv rtsp流协议

    我想处理并显示从树莓派相机创建的网络 rtsp 流 我有这个代码 include

  • 我的项目中 SDL2 的链接器错误

    我使用 CMake 和 Code Blocks 从源代码构建 SDL2 并尝试将我自己的项目源链接到以下静态库 libSDL2 a libSDL2main a OpenGL32 lib 这三个库包含在称为 libdir 我使用批处理命令 我

  • 一个可定制的 diff 工具，可以生成报告（XML、HTML 格式）

    我想为非回归测试提供差异报告 我的程序是基于 Java 的 但我没有找到任何 API 来满足我的需求 因此 我使用外部工具 CSDiff 它接受 2 个文件作为参数并返回 HTML 报告 这很好而且很容易设置 现在我遇到的唯一问题是 HTM

  • iPhone——当 alpha 设置为零时，为什么 UIViews 上的 TouchBegan 不触发？

    是否正在进行一些优化以删除视图或其他内容 尽管我已经将其设置为透明 但我仍然希望它能够接收触摸事件 如果 alpha 0 这些事件似乎不会触发 你说得对 在透明视图上检测不到触摸 http developer apple com iphon

  • 1024px宽度的屏幕和1024px宽度的平板电脑是冲突的

    我正在使用 MediaQuery 创建响应式网站布局 如下所示 除了一个邪恶的问题外 一切正常 core css 默认应用于站点 它是桌 面版本的样式表 但正如您在此链接中看到的 当屏幕宽度为 1024px 或以下时 它将链接到 table

热门标签