css - 无论如何，有没有通过CSS中的通用层次结构来最小化选择？

简而言之，我想转一下：

#WRITE-USER input[type=text],
#WRITE-USER input[type=password],
#WRITE-USER input[type=email],
#WRITE-USER textarea,
#WRITE-USER select {
     /* common properties */
}

在这样的事情：

#WRITE-USER {
     input[type=text], input[type=password], input[type=email], textarea, select {
          /* common properties */
     }
}

反正有做吗？

谢谢你的帮助。

最佳答案

不在纯CSS中，但是您可以使用以下CSS实现来实现此目的：

http://lesscss.org/

http://sass-lang.com/

更少的CSS很棒，因为它可以在浏览器中运行，您甚至可以在CSS中使用变量，并在单击按钮时使用javascript随时更改它们。

如果要在以后将其编译为css并希望在nodejs中编译css服务器端，则最好使用Sass css。

就我个人而言，我更喜欢使用较少的CSS，因为我可以轻松地将其与javascript结合起来，以使用单个颜色变量动态更改整个colorchemes。像普通的CSS一样，也可以减少更少的CSS，因为这只是删除空格等，但是当站点未缓存时，站点将始终需要获取less.js资源，并且如果没有启用JavaScript，更少的CSS将无法工作。

您甚至可以这样做：

#WRITE-USER {
    /* write-user styles */
    input {
        /* input styles */
        &[type=text],
        &[type=password],
        &[type=email], {
            //specific input type style, yes we can use single line comments now
        }
    }
    textarea {
        /* textarea style */
    }
    select {
       /* select style */
    }
}

最有趣和有用的功能是混合和变量，不再重复代码：D

关于css - 无论如何，有没有通过CSS中的通用层次结构来最小化选择？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39125153/