1

我正在设计一个适用于台式机、平板电脑和手机的应用程序。

我有一些可折叠的内容,我想在桌面浏览器和 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,但没有运气。

谢谢

4

1 回答 1

0

我用过

@media all and (max-width: 650px) {
   .storage_devices {data-inset: "false"}
}

您可以更改宽度,然后添加方向以满足您的需要。

于 2013-02-20T01:00:58.503 回答