css - 使用 css 增加 html 元素的属性值？

Question

是否可以创建一个 css 类/id，它将一个值（例如，填充）添加到另一个类的相同属性值？

让我试着把它写得更清楚。

.someClass{
padding: 20px;
}

.thickenMe{
padding: 5px;
}

当我如下应用这些课程时，

<div class='someClass thickenMe'>
<!--planning to beef up this div-->
</div>

这个 div 的净内边距应该变成 25px。

可以只使用css吗？它只是一个想法！

score 2 · Accepted Answer

使用纯 CSS 是不可能的。

但是，您可以为每个可以“加厚”的元素编写一个 CSS 子句，如下所示：

.someClass{
padding: 20px;
}

.someClass.thickenMe{
padding: 25px;
}

另一种选择是使用边距和填充，如下所示：

.someClass{
padding: 20px;
}

.thickenMe{
margin: 5px;
}

不过，这可能是不可能的，这取决于您的其他 CSS。

尽管不是纯 CSS，但最简单的解决方案是使用 JavaScript。这是一个使用 JQuery 的示例：

var prevPad = $('.thickenMe').css('padding').replace("px", "");
prevPad =  parseInt(prevPad);
$('.thickenMe').css('padding', prevPad + 5 + "px");

score 0 · Accepted Answer

JavaScript不，如果您想动态更改属性，则需要使用客户端脚本（即）。或者，如果您只想通过从一些动态源编译来定义样式，请尝试LESS或SASS。

score 0 · Accepted Answer

很不幸的是，不行。您可以通过使用像LESS这样的 CSS 处理器来获得这种功能，它为您提供变量，或者您可以通过客户端脚本（使用 jQuery 最简单）来处理它，但原生 CSS 根本无法以这种方式工作。类在指定相同属性时会相互覆盖；它们不相互补充。

3 回答 3