Question

我认为有一种方法可以同时修改这两个元素吗？我试过a b + a c等等，但似乎没什么用。

输入此内容的最短方式是什么？

#a #b {
    width: 12px;
    height: 12px;
    background: url('xjpg');
    position: absolute;
    margin: 111px 0 0 222px;
}

#a #c {
    width: 12px;
    height: 12px;
    background: url('x.jpg');
    position: absolute;
    margin: 111px 0 0 333px;
}

Answer 1

#a #b, #a #c {
    width: 12px;
    height: 12px;
    background: url('x.jpg');
    position: absolute;
    margin: 111px 0 0 333px;
}

Answer 2

使用逗号将允许您将属性应用于多个选择器链，以及将相同的属性组合到一组属性中并覆盖第二个元素上的唯一样式。

最合成的方式是：

#a #b, #a #c {
    width: 12px;
    height: 12px;
    background: url('xjpg');
    position: absolute;
    margin: 111px 0 0 222px;
}

#a #c {
    background: url('x.jpg');
    margin: 111px 0 0 333px;
}

确保覆盖属性低于原始元素属性。

Answer 3

comma允许您为一组规则指定多个选择器。

#a #b,  #a #c {
  width: 12px;
  height: 12px;
  background: url('xjpg');
  position: absolute;
  margin: 111px 0 0 222px;
}

Answer 4

#a #b, #a #c {
    width: 12px;
    height: 12px;
    position: absolute;
}
#a #b {
    background: url('xjpg');
    margin: 111px 0 0 222px;
}
#a #c {
    background: url('x.jpg');
    margin: 111px 0 0 333px;
}

或

#a #b, #a #c {
    width: 12px;
    height: 12px;
    position: absolute;
    margin: 111px 0 0 222px;
}
#a #b {
    background: url('xjpg');
}
#a #c {
    background: url('x.jpg');
    margin-left: 333px;
}

使用多链式选择器

4 个答案: