有多个使用相同属性的类时如何将CSS转换为LESS

Question

这是我的CSS。 我如何将这段代码转换为LESS格式。

.A .B h4, .A .B h4 a, .A .C h4, .A .C h4 a, .D h4, .D h4 a 
{
    color: #345e8a !important;
    display: inline-block;
    font-family: @font-family-sans-serif;
    font-size: 17px !important;
}

Answer 1

LESS只是一个CSS预处理程序，它是您的选择器可以完成的改进，我们可以将其与LESS命名空间结合起来，以实现以下内容：

.A, .D
{
    h4, a
    {
        color: #345e8a !important;
        display: inline-block;
        font-family: @font-family-sans-serif;
        font-size: 17px !important;
    }
}

在上面，我简单地删除了.A .C和.A .B选择器。 如果需要这些，那么您可能最终会得到同样麻烦的解决方案，但可读性更高：

.A .B, .A .C, .D
{
    h4, a
    {
        color: #345e8a !important;
        display: inline-block;
        font-family: @font-family-sans-serif;
         font-size: 17px !important;
    }
}