2

如果我想<input type="submit"/>在<div class="control-group control-connected">in 中设置所有样式<form>，我可以应用这种类型的选择器：

form div.control-group.control-connected input[type=submit]{}

但是，假设我也想为<button>这些类型的 div 中的元素设置样式。

有没有比这样做更有效的方法？

form div.control-group.control-connected input[type=submit],form div.control-group.control-connected button

该实现似乎相当冗长，而且也是多余的，我不应该能够做这样的事情吗？

form div.control-group.control-connected (input[type=submit], button)
4

6 回答 6

2

更短的方法是对具有共同风格的元素使用类名。

于 2012-04-05T13:51:09.897 回答
0

如果您想使用更紧凑的语法，我怀疑您必须使用LESS 。

于 2012-04-05T13:51:14.810 回答
0

检查这个

http://sass-lang.com/

sass lang 会清理你的 CSS

于 2012-04-05T13:51:24.807 回答
0

如果您需要特异性，请使用您提到的符号。目前没有广泛支持原生 CSS mixin 来实现你想要的。

如果您对使用 CSS 提高开发人员的生产力感兴趣，我建议您尝试一下 SASS： http://sass-lang.com/

于 2012-04-05T13:52:40.200 回答
0

在我们获得对 CSS 嵌套的支持之前，您要么必须像这样写出来，要么使用某种预处理器，例如LESS或SASS，以允许您编写更易于阅读的样式表。

注意： LESS、SASS 和其他变体要求您在在网站上显示之前从输入格式（LESS、SASS 等）转换为 CSS。有自动执行此操作的方法（服务器端和客户端）。

LESS 中的示例

form div.control-group.control-connected {
 input[type=submit], button {
  /* Styles here */
 }
}
于 2012-04-05T13:55:41.533 回答
0

在原生 CSS 中，解决方案是：

1：给元素添加一个ID属性div.control-group.control-connected。

#control-connected input[type=submit],
#control-connected button {
    /* css */
}

2：给元素添加一个通用的类名。

.fancy-style {
    /* css */
}

非本地 CSS 解决方案将是SASS或LESS。

于 2012-04-05T13:55:48.193 回答