强制 jQuery mobile 使用自己的 CSS 类

Force jQuery mobile to use own CSS classes

本文关键字：自己的 CSS jQuery mobile 强制      更新时间：2023-09-26

我想强制jQuery mobile使用我自己的CSS类来覆盖默认值。更改jQuery CSS类（如ui-controlgroup）不是一个选项，因为我只想在某些情况下更改样式。当我将 CSS 类的内容放在div 的样式属性中时，我的样式被应用，但我不想使用此属性。

我尝试在触发"mobileinit"事件时添加我的类，但它也没有用。

下面是一个例子，我的类被称为"页脚-列-左"：

    <div id="footerMainpage" data-role="footer" data-position="fixed" data-theme="a" class="ui-grid-b">
    <!-- column 1 -->
    <div class="ui-block-a" class="footer-column-left">
        <div data-role="controlgroup" data-type="horizontal">
            <button id="buttonLeft" data-icon="arrow-l" data-iconpos="notext">Move left</button>
        </div>
        <div data-role="controlgroup" data-type="horizontal">
            <button id="buttonChooseTool" data-icon="edit" data-iconpos="notext">Choose tool</button>
            <button id="buttonUndo" data-icon="back" data-iconpos="notext">Undo</button>
            <button id="buttonRedo" data-icon="forward" data-iconpos="notext">Redo</button>
            <button id="buttonSave" data-icon="check" data-iconpos="notext">Save</button>
        </div>
    </div>
    <!-- ... -->
</div>

CSS 如下所示：

.footer-column-left { display: inline-block !important; text-align:left !important; padding-left: 10px !important; }

提前感谢您的帮助！

编辑：在触发"pageinit"事件时添加类对我有用，因此不需要进一步的帮助;-）

这两

件事对我有用：

  • 在触发"PageInit"事件时使用以下命令添加 CSS 类：

    $('#footerColumnLeft').addClass('footer-column-left');

  • 在 CSS 选择器中使用 id：

    #footerColumnLeft { text-align:left; padding-left: 10px; }

相关文章：