我正在设计一个适用于台式机、平板电脑和手机的应用程序。
我有一些可折叠的内容,我想在桌面浏览器和 ipad 横向中插入,但不想在平板电脑纵向和手机上插入。
我有其他响应式元素正常工作,但以下 html 和 CSS 无法正常工作:
HTML
<div id="storagePage" data-role="page" data-theme="a">
<div data-role="collapsible" data-collapsed="false" data-theme="b" data-content-theme="c" class="storage_devices" data-inset="true">
<h2>Header 1</h2>
<p>Content here</p>
</div>
</div>
CSS
@media all{
.storage_devices {data-inset: "true";}
}
@media (max-device-width: 520px) and (orientation:portrait) {
.storage_devices {data-inset: "false";}
}
我假设 JQuery Mobile 库正在标记 html,因此该类没有正确识别 div。我也尝试过使用id,但没有运气。
谢谢