如何使一个元素继承另一个元素的CSS规则集? [英] How to make an element inherit a set of CSS rules for another element?

问题描述

说我有一个<div>这样的东西，它将具有与背景图片或类似图片相同的所有属性:

Say I have a <div> like this that is going to have all of the same properties with a background image or something like that:

div.someBaseDiv {
    margin-top: 3px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
}

我想这样继承:

div.someBaseDiv someInheritedDiv {
    background-image: url("images/worldsource/customBackground.gif");
    background-repeat: no-repeat;
    width: 950px;
    height: 572px;
}

我当然可以肯定这写错了，而且我不害怕寻求帮助，所以有人可以告诉我如何进行这项工作并包括HTML标记吗?

Of course I’m pretty sure this is written wrong, and I’m not afraid to ask for help, so can someone tell me how to make this work and include the HTML markup?

推荐答案

最简单的方法是将someInheritedDiv元素添加到这样的第一个规则中.

The easiest is to add your someInheritedDiv element to the first rule like this.

div.someBaseDiv,
#someInheritedDiv
{
    margin-top:3px;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:0px;
}

这将告诉您的#someInheritedDiv应用与div.someBaseDiv相同的样式.然后，您可以#em>扩展这套样式，使其更特定于您的#someInheritedDiv:

This will tell your #someInheritedDiv to apply the same styles as div.someBaseDiv has. Then you extend this set of styles with more specific to your #someInheritedDiv:

#someInheritedDiv
{
    background-image:url("images/worldsource/customBackground.gif");
    background-repeat:no-repeat;
    width:950px;
    height:572px;
}

这是CSS中特异性的工作方式.

This is how specificity in CSS works.

这篇关于如何使一个元素继承另一个元素的CSS规则集?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！