为什么不应用这种嵌套的CSS样式？

Question

式：

a = [1 2 3 4];
b = [2 1 3 1];

switch class(a)
    case 'double'
        switch class(b)
            case 'double'
                a + b
        end
    case 'logical'
        switch class(b)
            case 'logical'
                a & b
        end
end

HTML：

.airport-selections {
    margin-top: 10px;

    .airport-input {
        width: 200px;
    }
}

如果我没有嵌套它们，则输入的宽度设置为200.页面上的所有样式也会出现这种情况。

Answer 1

你的CSS无效，在CSS中没有嵌套这样的东西。只有Less或Sass，但在那之前你还有很长的路要走。

如果您想从其他人中选择元素，请使用

.father .child{
    yourstyle
}

具有类child的所有元素都来自具有类父的所有元素，将获得应用于它们的样式。

.airport-selections {
    margin-top: 10px;
}
.airport-input {
    width: 200px;
}

/*or 

.airport-selections .airport-input {
   width: 200px;
}
*/

<div class="airport-selections">
    <label class="airport-label" for="airport-from">Departure:</label>
    <input type="text" class="airport-input">
</div>

Answer 2

没有CSS预编译器，就没有嵌套的CSS样式。

检查SASS或LESS是否有嵌套和其他选项。但是你所拥有的并没有做你认为它做的事情。