css - 从父类以外的类继承属性

标签 css

假设我的 CSS 中有两个类,.classA{}.classB{},我已经定义并定制了 classA 到我喜欢的方式。现在我希望 classBclassA 基本相同,但有一些更改。由于它们将单独使用(即 A 不是 B 的父级),因此 B 不会在布局中从 A 继承属性。我可以做类似的事情吗?

.classB{
    from .classA inherit *
    some additional changes
}

在编写 CSS 时,这将避免复制/粘贴,并确保如果我稍后更改 A,B 会自动更改,我不必跟踪它。

最佳答案

CSS 没有变量的概念来允许调整一个 CSS 度量来自动影响其他度量。然而,有允许变量的 CSS 编写系统(然后“编译”并吐出纯 CSS)。这些很有用,但需要使用特定的框架。 (一个例子:http://lesscss.org/)

如果您使用的是服务器端脚本语言,例如 PHP,您可以将 CSS 文件编写为 PHP 文件,并在其中使用变量。

除此之外,我会使用多个类:

.sharedStyles {...the styles to be the same on elements}
.uniqueStylesA {...}
.uniqueStylesB {...}

然后这样申请:

<div class="sharedStyles uniqueStylesA">...</div>
<div class="sharedStyles uniqueStylesB">...</div>

或者...如果您可以嵌套在 HTML 中:

<div class="sharedStyles">
    <div class="uniqueStylesA">...</div>
    <div class="uniqueStylesB">...</div>
</div>

关于css - 从父类以外的类继承属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5372447/

相关文章:

html - 仅限 CSS - 带有滚动条的动态标题高度和 100% 内容高度

javascript - 仅限 CSS 内联滚动

javascript - 使用 jQuery 或 JavaScript 绑定(bind)到自定义 CSS 动画结束事件?

html - HEAD 中的更改使网站无法正常工作?

html - CSS:从元素本身获取边框颜色

html - 媒体查询不起作用(提供代码)

javascript - 更改 div bgcolor onkeypress

jquery - 自定义 HTML5 范围输入和句柄偏移

html - 通过应用长度和高度来解构图像

java - 是否可以部分突出显示字符?