如何在 html/css 中水平滚动移动/平板电脑视图中的内容?
我有一个 fiddle，我通过查看下面的屏幕截图复制了它:> 我用于单个方框项目的 CSS 代码是: .product-contents .product {宽度:10%；文本对齐:居中；高度:150px；填充顶部:1%；填充左:1%；右填充:1%；边框样式:实心；边框宽度:3px；边框颜色:rgb(145, 147, 150);背景颜色:白色；边框半径:10px} 问题陈述: 现
..
media-queries相关内容
我们可以使用媒体查询/js/jquery 为移动设备/平板电脑默认以横向模式打开我们的网页吗?
是否可以使我的网页在手机或平板电脑中以横向模式默认打开，即使使用 css3 媒体查询或 jquery 关闭屏幕方向?? 解决方案 您可以这样做.这是否是一个好主意，我会让你决定(提示:不是). 使用 CSS 检查纵向方向并在必要时旋转主体: @media screen and (orientation:portrait) {身体 {变换:旋转(-90度)；变换原点:50% 50%；
..
Gmail 响应式电子邮件 - 媒体查询 - 样式标签
请看这里:Gmail 应用(Android)上的响应式电子邮件 我正在尝试构建一个用于所有电子邮件客户端的响应式电子邮件.Gmail 正在从头部/正文中剥离我的样式标签，因此查询也被剥离了. 我已经使用 Email On Acid 进行了测试，Gmail 只显示两个版本！ 这里的解决方案是什么: 1) 使用框架?- 即使这些使用样式/媒体查询 2) 外部样式表 - 有
..
如何根据窗口宽度加载不同的 css 文件:无法识别较小的尺寸
如果窗口大小低于 500 像素，我想加载不同的 css 文件.我有
..
使用 CSS 更改浮动 div 的顺序
JSFIDDLE 我想更改某个像素大小的浮动 div 的顺序. 在默认状态下，它们都有 50% 的宽度并且它们彼此相邻. 低于 600 像素的屏幕尺寸(或 w/e 无关紧要)我希望第二个 div(红色)浮动在第一个 div(黄色)之上. 仅使用 CSS 的解决方案怎么可能做到这一点? HTML
CSS .yell
..
媒体查询在 IE9 iframe 内失败
我的 CSS 中有以下媒体查询: @media screen and (min-width: 0px) and (max-width: 319px) {身体{背景颜色:红色；}}@media screen and (min-width: 320px) and (max-width: 480px) {身体{背景颜色:橙色；}}@media screen and (min-width: 481px)
..
CSS3 媒体查询 - 在某些浏览器中不起作用(官方支持 MQ)
请告诉我 - 我在哪里犯了错误以及为什么页面在没有媒体查询的情况下显示在 Opera mini 中? jsfiddle - http://jsfiddle.net/vhCLs/ 或 cssdesk - http://cssdesk.com/fPS2s
..
平板电脑最小分辨率和最大分辨率的媒体查询
目前正在开发一个响应式设计网站.我使用媒体查询根据宽度和屏幕分辨率定位不同的设备. 我有一个场景，我想使用屏幕分辨率来定位设备，但我不明白这是如何工作的. 我想检查最小宽度和最大宽度，屏幕分辨率也可能从 97dpi 到 ipad 最大分辨率 264dpi.但这似乎不起作用.如果我为 hp 加载的平板电脑提供单个分辨率 min-width:155dpi 它可以工作.但是最小到最大分辨率条
..
CSS 媒体查询、像素密度、桌面和移动设备
情况: 我有 5 个 CSS 文件: base.css 带有一些适用于任何地方的样式 339px.css，宽度最大为 339px 639px.css，宽度最大为 639px 999px.css 和 bigscreen.css 用于宽度超过 999 像素的任何内容 代码:
..
防止菜单在 768px 显示 CSS 媒体查询中折叠
我正在尝试使用 twitter bootstrap 做一个网站.我的菜单相对较少，所以它也适合 768px 显示.但默认情况下，在引导程序中，菜单会使用媒体查询折叠.我无法阻止这种行为. 这是我的 html
..
用于移动和视网膜显示器上高分辨率图像的 CSS
对于使用 Retina 显示屏的用户来说，我的网站图像看起来很模糊.(例如，在 Retina MacBook Pro 上). 如何向使用 Retina 显示器的访问者提供高分辨率图像，向其他人提供标准尺寸的图像，同时保持图像的外观尺寸相同? 解决方案 在你的 HTML 中，像这样创建一个 : 并在您的 CSS 中添加: .ninjas-image {背景图片:url('n
..
iPhone 6 和 6 Plus 响应断点
根据 Apple 的网站: iPhone 6 的分辨率为 1334 x 750 像素，分辨率为 326 ppi，对比度为 1400:1(典型) iPhone 6+ 的分辨率为 1920 x 1080 像素，分辨率为 401 ppi，对比度为 1300:1(典型) 但是，每个 CSS 媒体查询响应断点是什么?(人像和风景) 我不完全了解如何使用各种响应式模拟器来测试视网膜屏幕
..
带有媒体查询的响应式设计:屏幕尺寸?
我正在使用媒体查询开发响应式设计的网站.但我不知道如何设置一个好的宽度. 正如您在此表中所见，即使对于单一类型的设备，也有很多不同的分辨率.而且随着移动设备上的分辨率越来越大，很难知道要为特定分辨率应用什么设计. 现在，我正在使用这个: 移动优先 @media 屏幕和 (min-width:720px) => Phablet @media 屏幕和 (min-width
..
切换到基于 Em 的媒体查询
现在 WebKit 页面缩放错误 已经修复，使用基于em的主要原因是什么媒体查询而不是基于像素的媒体查询? 赏金 我正在为我的问题增加悬赏，因为有这么多著名的 CSS 框架 和 网络 开发人员 使用基于 em 的媒体查询，我确信这样做必须有充分的理由. 我知道的一个优点是，如果用户更改浏览器中的默认字体大小，内容将 挤压 的方式类似于 page-zoom 解决的问题修复.是否有任
..
视网膜显示屏，高分辨率背景图像
这听起来像是一个愚蠢的问题. 如果我将此 CSS 片段用于常规显示(其中 box-bg.png 为 200px x 200px)； .box{background:url('images/box-bg.png') 无重复左上角；宽度:200px；高度:200px} 如果我使用这样的媒体查询来定位视网膜显示(@2x 图像是高分辨率版本)； @media (-webkit-min-devi
..
CSS 媒体查询 - 订单很重要?
现在经常使用 CSS 媒体查询，我想知道它们的最佳使用顺序是什么. 方法一 @media only screen and (min-width: 800px) {#内容 { ... }#sidebar { ... }}@media only screen and (max-width: 799px) {#内容 { ... }#sidebar { ... }} 像这样，代码显然更短，但是使
..
Bootstrap - 当屏幕尺寸较小时删除填充或边距
已编辑:也许我应该问当屏幕缩小到 480px 宽度以下时哪个选择器设置侧边距?我一直在浏览 bootstrap-responsiveness.css 一段时间来找到它，但似乎没有任何影响. 原创我基本上想删除任何默认的填充或边距设置，以便在较小的设备屏幕上响应. 我在 container-fluid 选择器上覆盖了 background color，对于更大的屏幕，它们在整个宽度上完美
..
花式媒体查询少一些魔法
在一些 css-classes 中使用 less 包装不同分辨率的 css-styles 会很好. 我想做类似的事情: 页脚{宽度:100%；}.药片 {页脚{宽度:768px；}}.桌面 {页脚{宽度:940px；}} 最后应该是这样的结果: 页脚{宽度:100%；}@media 屏幕和(最小宽度:768px){页脚{宽度:768px；}}@media 屏幕和(最小宽度:992px)
..
媒体查询 - 移动浏览器与桌面浏览器
我看到许多网站在桌面浏览器和手机浏览器上都具有响应性，我正在一个网站上工作，我有以下样式表设置:(Hicks Design 网站是我想要实现的一个很好的例子，如果你需要一个) /* 普通样式放在这里 */@media 屏幕和 (min-device-width:321px){/* 样式 */}@media 屏幕和(最小宽度:701px){/* 样式 */}@media 屏幕和(最小宽度:1025
..
如何制作响应式表格
我有一个表格来表示我的 html 页面中的一些数据.我正在尝试使该表具有响应性.我该怎么做? 这是Demo. 解决方案 基本 响应式表格只是一个 100% 宽度的表格. 你可以使用这个 CSS 来设置你的表格: .table { 宽度:100%;} 此处演示 您可以使用媒体查询通过添加类(或使用 nth-child 等定位)根据屏幕尺寸显示/隐藏/操作列: @
..