Question

我的问题的两个部分：

1）有没有办法在CSS中继承另一个控件的属性和样式？假设控件没有父/子层次结构，并且可以是完全不同的控件类型：

IE：

#MyFirstControl
{
  width: 100px;
}

#MySecondControl
{
  width: MyFirstControl.styles.width; /* This doesn't work */
}

2）假设Label标签是任何其他标签的子标签。 width属性既不能用于“inherit”，也不能用于“auto”。怎么了？

IE：

<style>
  div
  {
    width: 100px;
  }
</style>

<div>
  <!-- This label does what it wants for width. It's not the width of the containing div -->
  <label style="width: inherit">Some Text</label>
<div>

Answer 1

第1部分：您希望使用类名而不是ID来控制样式：

.control_a {
  width: 100px;
}

<blah id='MyFirstControl' class='control_a'/>
<blah id='MySecondControl' class='control_a'/>

这使您可以跨任意数量的标签共享样式。另外，请记住，您可以在一个元素上使用多个类名：

.control_a {
  width: 100px;
}

.red { background: #f00; }    
.blue { background: #00f; }

<blah id='MyFirstControl' class='control_a red'/>
<blah id='MySecondControl' class='control_a blue'/>

这使您可以为单个元素选择许多不同的样式源。

Answer 2

无法继承CSS“对象”。您可以从其他标记内的标记继承样式，但它是继承的标记，而不是样式本身。如果您将标记放在具有其他样式的标记内，它将继承该样式。

将CSS样式视为对象可能会很有趣，因为您可以避免大量编码，但是因为您可以创建一个可以应用于不同类型对象的类，甚至可以将多个类应用于标记，它比必要的更有趣。

我不确定第二个问题，但我认为这与您应用于标记名称而不使用类或ID的事实有关。我不得不更多地玩它，看看我是否能解决问题。

Answer 3

1）由于CSS不允许自引用，因此您可以使用相同样式指定两个单独元素的公共方面：

#MyFirstControl, #MySecondControl
{
  width: 100px;
}

2）如果要相信我的IDE和浏览器，inherit在该上下文中不是width的有效值，但我不确定原因。这可能就是你的例子不起作用的原因。

CSS控件继承 - 继承其他控件样式

3 个答案: