Question

基本上我的ASP.NET应用程序中有一个主题，它包含一个css文件，可以将我的所有表格变为蓝色，看起来很棒。

看起来像这样

table
{
    background-color: #DEF1FF;
    border-color: #DEF1FF;
    color:#5793C9;
}
td
{
 // TD properties
}

但现在我希望一张桌子成为不同的颜色。我创建了一个类来覆盖它：

.BlankTable
{
    background-color:#FFFFFF;
    color:#5793C9;
    font-size:medium;
    font-weight:bold;
    margin:2px;
}

我设置了<table class="BlankTable">，我有两个问题：

首先，如果我在另一个表中放入另一个表，它不会继承BlankTable但会使用css文件的原始表部分

其次，如果我使用td部分来设置特定于td的属性（如填充），则不会传递 - <table class="BlankTable><tr><td>hello world</td></tr></table>导致使用我放入CSS文件中的td。

理想情况下，我想要的是设置我的CSS代码：

.Blank
{
    background-color:#FFFFFF;
    color:#5793C9;
    font-size:medium;
    font-weight:bold;
    margin:2px;

    table { // properties }
    td { // properties }
}

所以它使用我为.Blank css类指定的table / td属性。有没有办法做到这一点或以某种方式重构我的代码所以我可以让所有表默认为蓝色，并能够轻松覆盖它？

Answer 1

你可以这样做，但语法是：

.Blank
{
    background-color:#FFFFFF;
    color:#5793C9;
    font-size:medium;
    font-weight:bold;
    margin:2px;

}

.Blank table { // properties }
.Blank table td { // properties }

这最后两条规则将匹配一个表和位于“Blank”类的任何内容的td。

Answer 2

像这样使用：

.Blank table {...}
.Blank td {...}

虽然我必须警告你：在极少数情况下你应该在另一个表中使用一个表。

Answer 3

其他答案是正确的，但值得指出的是，这只是一种CSS选择器（后代选择器）。您可能希望使用各种其他CSS selectors来定位特定元素。

值得熟悉它们 - 你可能会对可以（而且不能）做的事情感到惊讶。（如果你熟悉CSS选择器，使用jQuery也会容易得多。）

CSS压倒一切的困境

3 个答案: