我有以下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>
的其他实例,我不希望这些规则适用。
答案 0 :(得分:5)
只需使用后代选择器:
.datepicker-days table {
/* this rule will only apply to `<table>` elements that are descendents of any element with class "datepicker-days" */
}
答案 1 :(得分: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 */ }
答案 2 :(得分:2)
您将执行以下操作:
.datepicker-days table {
Styles here;
}
这会查找仅<table>
类
.datepicker-days
答案 3 :(得分:0)
如果您只需要将特定样式应用于一个唯一的div,为什么不给它一个id#