javascript - 带有类选择的 Css 选择器不起作用

Question

您好，我正在使用以下选择器来设置元素的样式，该元素位于我选择的父元素的第一个子元素上!由于该元素没有特定的类，因此我使用了此方法。但是样式不会添加到元素中。

.order-bar div[class^='col-']:first-child i[class^='fa-']:before{
    padding: 0px 20px;
    color: #ccc !important;
}

html

<div class='order-bar'>
    <div class="row">
        <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
            <i class="fa fa-circle"></i>
        </div>
        <!-- other elements -->
    </div>
</div>

Answer 1

[class^='fa-'] 部分是问题所在。 i 元素的类属性不是以 fa- 开头。将其更改为 fa 或改用 i.fa:before。