gpt4 book ai didi

javascript - 更改我的 jquery 移动主题会更改我的 css 样式

转载 作者:太空宇宙 更新时间:2023-11-04 14:15:49 24 4
gpt4 key购买 nike

我在我的网站上创建了一个可折叠的集合,看起来与此类似:

<div data-role="collapsible-set" id="result" style="margin: auto; padding-top: 50px; padding-bottom: 20px;">
<div>
<h2>
<span style="font-size: 16px; font-weight: bold; white-space: pre-wrap;" id="title' + num + '">abc</span><br>
<span style="font-size: 14px; font-weight: normal;" id="author' + num + '"></span>
<div style="font-weight: normal;">
<span style="font-style:italic; font-size: 13px;" id="journal' + num + '"></span>
</div>
</h2>
<div style="font-size: 14px;">
more info
</div>
</div>
</div>

但是,在我将主题应用到添加到可折叠集中的每个元素后,我的样式发生了变化,我不知道为什么。在我将一个 div 添加到我的可折叠集合之前,我添加了以下属性:

div.setAttribute("data-theme", "c");

这是我的列表项在设置样式之前的样子:

enter image description here

这是我添加主题后的样子:

enter image description here

如您所见,每行之间的间距现在非常大。我尝试使用填充更改 css,但这并没有改变任何东西。谁能指出我正确的方向?

这是一个之前和之后的 fiddle :

Before

After

最佳答案

您需要升级 theme-classic.css 使用jQuery Mobile ThemeRoller .

  1. 转到 download page并向下滚动到“旧版
  2. 在 1.3.2 版本下 - CSS open Uncompressed with Default theme: jquery.mobile-1.3.2.css , 复制其内容。
  3. 转到 jQuery Mobile ThemeRoller ,从顶部工具栏中单击“导入或升级”。将打开一个新窗口
  4. 在该窗口中,粘贴 1.3.2 CSS 样式。从选择菜单中,选择“升级到版本 1.4.5”,然后单击“导入”按钮
  5. 查看复制的主题,根据需要进行更改。完成后,点击顶部工具栏中的“下载”,为您的主题命名并下载升级后的经典主题。
  6. 按以下顺序放置新主题和其他依赖

    <head>
    <link rel="stylesheet" href="css/themes/my-custom-theme.css" />
    <link rel="stylesheet" href="css/themes/jquery.mobile.icons.min.css" />
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile.structure-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    </head>

Demo

关于javascript - 更改我的 jquery 移动主题会更改我的 css 样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26987535/

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