attribute class css

Question

我给出了下面的css规则，它在chrome中不能正常工作…我确信这是由于属性的顺序.....我想所有的焦点和悬停都必须放到一个悬停和焦点中。

.chk{
    .ico {
        background-position: -17px top;
        .stdChk;
    }
    &:hover .ico {
        background-position: -17px -34px;
    }
    &:focus .ico {
        background-position: -17px -51px;
    }
    &.disabled .ico { background-position: -17px -17px; }
    &.checked {
        .ico { background-position: left top; }
        &:hover .ico { background-position: left -34px; }
        &:focus .ico { background-position: left -51px; }
        &.disabled .ico { background-position: left -17px; }
    }
}

但是我对这种模式很陌生，所以我不确定如何组织…请提供任何帮助…

Answer 1

这不是CSS。这是SASS代码，在发送到浏览器之前必须编译成CSS。

这就是为什么它不能在Chrome(和任何其他浏览器)工作。