html - 媒体查询 CSS

标签 html css media-queries

由于某些原因,当我从 iphone 或移动设备上查看时,我的媒体查询无法正确调整我的网站大小,我在 iphone 上获得了该网站的平板电脑版本。媒体查询在平板电脑上运行良好,在缩小浏览器窗口时也能完美运行。

我错过了什么吗?

@media only screen and (min-width: 1024px) {
/*styling here*/
}

@media only screen and (max-width: 1023px) and (min-width: 740px) {
/*Tablet styling here*/
}

@media only screen and (max-width: 739px) and (min-width: 0px) {
/*Mobile styling here*/
}

最佳答案

查看 this , 让我知道它是否有效

您需要指定设备宽度。

关于html - 媒体查询 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11561035/

相关文章:

html - 如何修复打开页面时按钮转换为带边框的自定义按钮?

html - Safari 8 : Flexbox's "justify-content" isn't working at all

css - CSS3 中媒体查询的最佳实践是什么?

css - 媒体查询分组而不是多个分散的媒体查询匹配

javascript - 通过 Javascript 从 PHP 保存到服务器端文件

html - 有人打印网页时的服务器端日志记录

javascript - jQuery总是返回 “jQuery.fn.init [global]”。我无法选择元素

css - ie6 修复需要背景。需要一个解决方法

html - 当媒体查询覆盖其他媒体查询时

javascript - 从列表 Javascript 中动态删除项目