css - 如果嵌套元素，CSS会更改样式

Question

如果存在嵌套元素，CSS中有没有办法调整父元素的样式？

例如，假设我们有一个在 10px 左右有内边距的按钮。

<button>Submit</button>

现在，假设我们为此添加了一个图标：

<button><i class="icon"></i> Submit</button>

由于图标的原因，按钮左侧的间距过宽。有没有办法不向按钮添加额外的类，说如果它包含<i>，使左边的填充更少？

谢谢！

Answer 1

唉，你现在不能这样做。建议用于css4。

Answer 2

听起来你应该只使用不同的元素来定位。这是没有语义意义的元素<span>派上用场的地方：

<button><span class="text">Submit</span></button>
<button><i class="icon"></i> <span class="text">Submit</span></button>

如果您使用该 HTML，则可以只.text使用margin/padding来定位。