媒体查询未在 Ipad 应用程序上显示任何输出
Posted
技术标签:
【中文标题】媒体查询未在 Ipad 应用程序上显示任何输出【英文标题】：Media Queries not displayed any output on Ipad application 【发布时间】：2016-08-02 09:32:18 【问题描述】：我已经添加了我的媒体查询，当我在这个site 下运行时，它似乎没有显示我期望的正确输出。这是我为这款手机所做的第一次测试
这是我的媒体查询
@media screen and (min-width: 768px) and (max-width: 1024px), (min-device-width: 768px) and
(max-device-width: 1024px) and (orientation : landscape)
.wrap
width:95%;
.box
width:29.33%;
float:left;
margin:0px 42px 0px 0
html
background-color:red;
我对 body 和 html 进行了故障排除，但背景颜色未显示
这是我的site
我的 CSS
.wrap
width: 90%;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
.box
width: 29.33%;
float: left;
【问题讨论】：
您的网站在哪里？发布链接，如果不发布所有css代码，然后也发布html代码。 我已经更新了我的问题，并且我的站点链接在那里..如果您需要 CSS，我也可以发送它 也添加一个Css。它被包含了 【参考方案1】：我已添加我的媒体查询
但是您忘记了媒体查询中的一个关键要素，即元视口元素。例如。
<meta name="viewport" content="width=device-width, initial-scale=1">
您需要将其放在页面的head 中，以便媒体查询运行。
【讨论】：
【参考方案2】：在你的 html 文件中有
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">那个比较老，我会用html5 doctype替换它
<!DOCTYPE html>顺便说一句，那个地方看起来不错。
【讨论】：
感谢 Mate.changed it.我希望你喜欢我的网站..;) 仅供参考，如果我删除了“-//IETF//DTD HTML//EN">”它在 chrome 中看起来会有所不同...删除并添加我的增益网站在 chrome 中看起来不错..所以我就这样离开了 不，如果您想更改它并将原始页面保存为 index2.html。然后打开两者并排查看。 谢谢..我清除了 chrome 中的缓存..已经删除了你上面所说的，它看起来不错 很高兴听到以上是关于媒体查询未在 Ipad 应用程序上显示任何输出的主要内容，如果未能解决你的问题，请参考以下文章
右侧细节 UITableViewCell 未在 iPad 上显示整行
是否可以使用 css 媒体查询在 ipad 上定位 Kindle 应用程序？