在下面的示例中,我只想显示一个div
,具体取决于设备。如何更改基于移动设备的CSS?
我熟悉如何使用@media
覆盖CSS类,但不知道如何做一个条件。
<style type="text/css">
@media (max-width : 770px) {
...
}
@media (max-width : 320px) {
...
}
//do I need another for the desktop?
</style>
//if desktop
<div style="width: 400px; float: left;">
this is desktop
<a href="somepage.html"><img src="aLargeImage.png"/></a>
</div>
//if mobile
<div style="width: 200px; float: left;">
this is mobile
<a href="somepage.html">just text</a>
</div>
有什么建议吗?
我在这里有点困惑,但所有你想要显示不同的div元素取决于用户访问的屏幕大小? – Hoshts 2013-04-22 21:01:50
无论内容是否隐藏,用户仍然会最终下载内容。这些日子,许多人通过移动计划的KB付费。 – cimmanon 2013-04-22 21:15:28
没有那么多。很多计划都是无限的数据。但不是每个KB问题的解决方法。我认为隐藏/显示这两个div是解决方案。我只需要使用不同的类名称。 – 4thSpace 2013-04-22 22:11:00