<form>内的样式<select>

我有一些这样的代码:

<form>
    <select name="slctr__lvl1">
        <option selected>aaa</option>
        <option value="1">1</option>
    </select>
</form>

我尝试通过以下方式进行CSS:

[name="slctr__lvl1"] {
    width: 150px;
}

select {
    width: 150px;
}

font select {
    width: 150px;
}

但没有一个成功。我希望它看起来像我写的

<form>
    <select name="slctr__lvl1" style="width: 150px">
        <option selected>aaa</option>
        <option value="1">1</option>
    </select>
</form>

但是CSS似乎没有作用。

评论
  • 呐个牠
    呐个牠 回复

    You can use CSS Attribute Selectors:

    The [attribute="value"] selector is used to select elements with a specified attribute and value.

    请尝试以下操作:

    form select[name="slctr__lvl1"] {
        width: 150px;
    }
    <form>
        <select name="slctr__lvl1">
            <option selected>aaa</option>
            <option value="1">1</option>
        </select>
    </form>

    You can also read further on MDN's Attribute selectors documentation.