问题标签 [device-width]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
css - 移动媒体查询、分辨率和ppi模拟器？
是否有任何种类的桌面工具或浏览器插件能够模拟各种移动和平板设备以正确测试响应式设计？而且我不仅仅是在谈论更改浏览器窗口的大小。其他项目也需要模拟：
- 设备宽度
- 最小设备宽度
- 最大设备宽度
- 方向（横向/纵向）
- -webkit-min-device-pixel-ratio
- 解析度
- ppi
ipad - 为什么我的 iPad 上 safari 视口的宽度只有 768 像素而不是 1028 像素？
在我阅读的所有地方，Ipad 1 的屏幕宽度都是 1024 x 768。
我使用引导程序构建了一个站点，当在 iPad 上以横向模式查看站点时，会出现可折叠的导航按钮。它不应该。它应该只出现在宽度小于 1024 像素的视口中。
然后我嗅出宽度，因为 jQuery 使用 $(window).width(); 看到它。它只报告 768px x 467px；
我有以下元标记：
元名称=“视口”内容=“宽度=设备宽度”
android - 三星 Galaxy Note II 的设备宽度是多少？
我找不到适用于网络浏览器的三星 Galaxy Note II 的真实设备宽度，我找到了 320 像素、480 像素和 640 像素这 3 个不同的值，但我不知道哪个是正确的。
顺便说一句，我在维基百科上找到了按像素密度排列的显示器列表，但没有设备宽度......
编辑：我正在寻找在移动浏览器（视口）中声明的网络设备宽度。
iphone - 元视口 - 设备宽度必须是最小值
我们创建了一个优化为 480px 的网站。但是，如果我们将元视口设置为 device-width 且初始比例 = 1，那么在 iPhone 上，宽度为 320 像素，站点为宽。
将初始比例设置为 0.65 时，该站点在 iPhone 上很好，但在 iPad 上，该站点太小了！
我们如何将显示站点的最小宽度设置为 480 像素但没有水平滚动条？Body { min-width 480px; }已在 CSS 中设置。
css - CSS：我似乎总是需要多个相同的媒体查询
所以我似乎总是对智能手机做两个相同的媒体查询，一个是最小或最大宽度，另一个是最小或最大设备宽度（针对 iPhone 和其他东西）......
现在我不禁觉得这不是最有效的做事方式......特别是如果我要移动很多东西/重新设计我的网站/应用程序以特定于手机。尤其是当我必须为平板电脑尺寸再做两个时。
现在我真的需要两者吗？这有关系吗，到底有什么区别？
javascript - wordpress 菜单移动放置问题
我在 iPhone 和可能的 Android 手机上的主菜单有问题。菜单宽度设置为 100vw 到 600px。但是，在 320px 或 480px 的屏幕上，当点击菜单按钮进入页面时，页面每次都会缩小一点。
菜单使用简单的 javascript 配置，如下所示：
该页面在计算机上的 320px 浏览器窗口上运行良好，所以我猜这个问题是特定于设备的。
我正在使用标准的 Wordpress 主题 Twentytwelve，可以在此处找到该页面：
我会提出任何建议！
/斯蒂柳斯
android - 移动内容 witdh(body) = 媒体宽度，但用户仍然可以滚动
我忽略了所有的网络（我猜）并试图找到这个任务的解决方案：我有在移动设备上显示正确内容的所有要求（我的意思是元媒体和 css 媒体等），但在我的安卓手机上我可以向右滚动。我检查了是否没有宽度超过 320 像素的 div。我说的网站是http://vasiliib.p.ht/leverage/
我认为这是因为我的页面内容并创建了一个单独的页面http://vasiliib.p.ht/leverage/mobile.html。在这里，我插入了简单的 html 代码。而且，有同样的问题..
我很沮丧..请清洁我的眼睛..并告诉我我的错误，拜托..
期待您的回复。问候。
css - 为什么我的响应式 CSS 没有占用媒体宽度？
正如标题所说，我无法为我的 PHP 网页设置特定于媒体屏幕宽度的 CSS。
这是我的<head>部分index.php：
对于我的 HTML 元素<header> ... </header>，在我的 CSS (in style.css) 中，我指定：
但是使用“Web Developer”工具栏的Resize » View Responsive Layouts在不同宽度的设备布局中显示出一些下降。
例如：
在我的<header>标签中，内部元素都出来了，所以我需要增加表头的高度。所以我指定style.css：
但它不起作用。:(
我对响应式 CSS 缺少什么？
编辑
在前 2 个答案之后，根据他们的建议，我尝试使用：
是的，我将我的媒体 CSS 放在style.css.
我还尝试将mobile.cssas 分开：
我尝试放置以下代码的地方：
仍然无法正常工作。
javascript - 当我的窗口宽度小于 800 像素时，如何将 js 滑块效果更改为淡出？
我正在寻找一种方法，以便当我的浏览器窗口小于 800 像素时，我的 js 滑块将其效果从（现在正常）更改为淡出。有人可以帮忙吗？
css - 如何在浏览器中模拟设备宽度和方向来测试媒体查询？
我正在本地开发我的网站并使用 Chrome 随时预览它。虽然调整浏览器的大小以测试使用 的媒体查询确实很容易max/min-width，但据我所知，无法max/min-device-width使用任何内置设置进行模拟。是否有一个 Chrome 扩展程序可以模拟移动设备并触发媒体查询，特别max/min-device-width是orientation:portrait/landscape？
我基本上想要一些方法来在我的计算机上而不是智能手机上使用 Chrome 测试这个媒体查询：
@media only screen and (max-device-width: 600px) and (orientation: portrait)