更改下拉菜单文本对齐实现1.0.0

时间:2018-10-13 18:13:03

标签: javascript jquery css materialize text-alignment

我正在使用实现1.0.0 我想将下拉菜单的文本对齐方式更改为右...但jquery选项将不起作用 甚至CSS也没有响应(text-align:right!important;) 右类或右对齐

我决定更改所有J代码

帮助...

1 个答案:

答案 0 :(得分:0)

您需要检入 materialize.css 文件以查找需要自定义的类。在这种情况下,.dropdown-content li类需要进行编辑。

HTML

<div class="container">
    <div class="row">
        <a class='dropdown-trigger btn btn-large' href='#' data-target='dropdown1'>Drop Me!</a>
    </div>
</div>

<!-- Dropdown Structure -->
<ul id='dropdown1' class='dropdown-content'>
    <li>
        <a href="#!">one</a>
    </li>
    <li>
        <a href="#!">two</a>
    </li>
    <li>
        <a href="#!">three</a>
    </li>
    <li>
        <a href="#!">
            <i class="material-icons">view_module</i>four</a>
    </li>
    <li>
        <a href="#!">
            <i class="material-icons">cloud</i>five</a>
    </li>
</ul>

CSS

.dropdown-content li {
    text-align: right !important;
}

jQuery

$(document).ready(function () {
    $(".dropdown-trigger").dropdown();
});

下拉菜单中的右对齐文本

Dropdown - Right Alignment