类选择不起作用的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元素的class属性不以fa-开头。将其更改为fa或改为使用i.fa:before。