gpt4 book ai didi

html - 一般媒体查询的问题。没有结果

转载 作者:太空宇宙 更新时间:2023-11-03 18:29:18 24 4
gpt4 key购买 nike

我似乎无法让任何媒体查询工作。我不知道为什么。我尝试了一百万种不同的东西。它只是行不通。

CSS:

@media screen and (max-device-width: 320px) {
#sidebar {
display: none !important;
}
}

HTML:

<body>
<div id="sidebar">
<ul>
<li><a href="about.html">About</a></li>
<li><a class="active" href="projects.html">Projects</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
<div id="side-footer">
<p><a href="mailto:business@darmisdigitaldesigns.net?subject=Website">Contact Webmaster</a><br />&copy; DDD 2012-2014</p>
</div>
</div>
<div id="content">
<div id="content-wrap">
<h1>Projects</h1>
<hr>
</div>
</div>

元标记:

<meta name="viewport" content="width=device-width,initial-scale=1">

最佳答案

检查这个fiddle

max-width 是目标显示区域的宽度,例如浏览器

max-device-width是设备整个渲染区域的宽度,即实际设备屏幕

在 fiddle 中使用这个 css 规则的正确方法是

@media screen and  (max-width: 320px) {
#sidebar {
display: none !important;
}
}

关于html - 一般媒体查询的问题。没有结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20196472/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com