4

我有以下 CSS 我只需要应用于特定的 div (因为冲突):

有问题的 div 具有类名 datepicker-days。我是否将以下声明table.datepicker-days.table?但是那我该如何声明.table下面的类呢?

CSS

    table {
      max-width: 100%;
      border-collapse: collapse;
      border-spacing: 0;
    }
    .table {
      width: 100%;
      margin-bottom: 18px;
    }
    .table th, .table td {
      padding: 8px;
      line-height: 18px;
      text-align: left;
      border-top: 1px solid #ddd;
    }

HTML

<div class="datepicker-days" style="display: block; ">
      <table class=" table-condensed">
         <thead>
             <tr>
                <th class="prev">
                ....

抱歉,如果不清楚,CSS 规则来自 Bootstrap。我只是使用了一些规则,因为我使用的 datepicker 插件取决于那些特定的规则。因此,在我的代码中有其他实例的地方<tables>,我不希望应用这些规则。

4

4 回答 4

6

只需使用后代选择器:

.datepicker-days table {
    /* this rule will only apply to `<table>` elements that are descendents of any element with class "datepicker-days" */
}
于 2012-07-31T22:19:50.943 回答
3
.datepicker-days { /* Targets the div */ }

.datepicker-days table { /* targets all tables nested in the div */ }

.datepicker-days > table { /*targets only tables that are direct children on the div */ }
于 2012-07-31T22:21:47.443 回答
2

您将执行以下操作:

.datepicker-days table {
    Styles here;
}

<table>这仅与.datepicker-days班级一起寻找

于 2012-07-31T22:20:55.993 回答
0

如果你只需要对一个独特的 div 应用特定的样式,为什么不给它一个 id #

于 2012-07-31T22:26:02.880 回答