css：如何继承整个类

我有定义了“t_data”类来定制大多数表的外观和感觉。css：如何继承整个类

虽然在某些情况下我需要额外的表格专业化：比方说，我希望“customers”和“orders”的表格看起来不同。

继承样式默认方式是描述两个类的CSS定义成相同的块，这样的事情：

table.t_data, table.t_data_order, table.t_data_customer 
{ 
    background-color: #080; 
}

这种方式工作得很好，直到一定程度上......直到我得到太多的不同定义。

现在我已经是这样的：

table.t_data thead tr th, table.t_data thead tr td, table.t_data tbody tr th,  table.t_data tbody tr td, table.t_data tfoot tr th, table.t_data tfoot tr td, 
table.t_group thead tr th, table.t_group thead tr td, table.t_group tbody tr th,  table.t_group tbody tr td, table.t_group tfoot tr th, table.t_group tfoot tr td 
{ 
    border: #333 1px solid; 
}

为了做定制T_DATA寻找t_data_customer和/或t_data_order不同我需要TRIPPLE该块......且有高风险错过一些元素......我也有超过10个这样的块不同的元素（如背景，字体等）

是否有任何CSS或甚至非CSS这样的事情解决方案？

非常感谢！

P.S.如果你没有任何解决方案，但只有想法，不要害羞地分享它们！有什么想法，欢迎

来源

2013-02-23 Budda

这在原生CSS中是不可能的，但是有一些CSS预编译器提供了继承等等， LESS：http://lesscss.org/ – 2013-02-23 17:23:06

在多个类中使用HTML元素可能会有所帮助。 – nwellnhof 2013-02-23 17:28:06

不幸的是，你不能用CSS来做到这一点。幸运的是，您可以使用CSS预编译器为您做到这一点（例如：LESS & Sass）。更确切地说，你可以使用Mixins（两种语言都支持）。

Mixins允许您通过简单地将类名称包含为其属性之一来将类的所有属性嵌入到另一个类中。这就像变量，但对于整个类。 Mixins也可以像函数一样运行，并且带有参数，如下面的示例所示。

.rounded-corners (@radius: 5px) { 
    -webkit-border-radius: @radius; 
    -moz-border-radius: @radius; 
    -ms-border-radius: @radius; 
    -o-border-radius: @radius; 
    border-radius: @radius; 
} 

#header { 
    .rounded-corners; 
} 
#footer { 
    .rounded-corners(10px); 
}

（实施例从以下）。这是你可以用你的t_data类做的事情。

来源

2013-02-23 17:28:00 MarcoK

还没有使用它，但很可能会继续使用LESS - 这听起来像一个非常好的主意。 – Budda 2013-03-08 05:14:07

有关添加新的通用CSS类表和目标

.common td 
.common th { 
}

之前你添加一个类你的表，你应该确保你的表的默认样式不够什么例如

td { 
    /* Sensible default for all table cells */ 
}

下一步是找到一个类名，它对于具有交替样式的表是“通用的”。流行的框架twitter bootstrap对带有边界的表使用“table-bordered”，其他人会争辩说找到一个语义共同点比较好。但这取决于你。

这不是语义或没有，但由于锯有史以来尼科尔Sullivan介绍，我无法找到演示，但我可以找到它报价：由 http://css-tricks.com/semantic-class-names/

在演示文稿中Nicole Sullivan最近我在CSS峰会上看到，她呼吁一些大公司在数千次的CSS文件中声明完全相同的颜色。

我一直在试图找出我们正在写出的css文件和旨在为大公分母的含义。

来源

2013-02-23 17:27:23 orjan

我是否正确理解你建议将所有常见的东西都默认为默认格式，以便减少需要重用的t_data类的数量？这不会真正起作用，因为我在很多场景中使用表格，并且需要确保每个类都会覆盖默认样式。事实上，它不仅仅是关于桌子。 – Budda 2013-02-23 19:43:04

这取决于网站，但我正在寻找创建一个合理的默认例如为了保持设计的一致性，一张桌子应该在整个场地或多或少具有相同的外观和感觉。然后你会有几张不同的表格，希望可以用同一个班级的一些常见的东西。 – orjan 2013-02-23 20:12:10

可以使用ID和类来代替定义许多类。

有了ID，您可以定义主要的CSS并使用您定义差异的类。

<table id="mainstyle" class="variation1"> ...

来源

2013-02-23 17:30:35 Mario

我通常每页都有几张表格，而使用ID进行格式化并没有看到attrective – Budda 2013-02-23 17:38:01

css：如何继承整个类

回答

相关问题