首页 > 解决方案 > 如何修改物化css选择选项?

问题描述

编辑

我正在尝试通过修改一些默认代码来修改具体化选择选项的插入符号,使插入符号靠近水平线,所以从

.select-wrapper .caret {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    z-index: 0;
    fill: rgba(0,0,0,0.87);
}

.select-wrapper .caret {
    position: absolute;
    right: 0;
    top: 15px;
    bottom: 0;
    margin: auto 0;
    z-index: 0;
    fill: rgba(0,0,0,0.87);
}

顶部:0;到顶部:15px;, 如果我在 chrome 检查元素上修改它,它会生效,但在我的自定义 css 文件上没有效果。我想知道为什么?

至于 HTML:

<div class="col s12 m8 l8">
    <select id="gender" name="gender_val">
        <option value="" disabled="" selected><< Pls select >></option>
        <option value="male">Male</option>
        <option value="female">Female</option>
    </select>
</div>

div tag我真的不知道要放在哪里。我刚刚在浏览器检查元素上看到了这个:

在此处输入图像描述

这是我所指的图像。

在此处输入图像描述

标签: htmlcssmaterialize

解决方案


当您在 CSS 中进行更改并检查时,您是否看到检查器中的更改?如果没有,很可能是 Chrome 的缓存在干扰您……在这种情况下,您可以在隐身模式下访问并检查是否显示了更改。


推荐阅读