0
下面是中使用的CSS类:CSS类没有得到应用到表行
.table-striped>tbody>tr:last-child>td,
.table-striped>tbody>tr:last-child>th>.total_row_dark {
background-color: #76767b !important;
color: #fff;
font-weight: 700;
}
tr.campare_row span {
background-color: #76767b;
border-radius: 5px;
color: #ffffff !important;
display: inline-block;
font-weight: bold;
margin: 3px;
padding: 6px 18px;
font-size: 16px;
border: 1px solid #ffffff;
}
.campare_row>td {
vertical-align: middle!important;
}
这些类都应该在这里被用于以下表行:
<tr class="campare_row total_row_dark" ng-repeat="location in vm.rwsTableData | filter : 'Summary'" ts-repeat>
<td> </td>
<td class="text-left">{{location.locationName}}</td>
<td class="text-right light-blue">{{(location.waterDemand == vm.constant.NO_WATER_SUPPLY)?'-':location.waterDemand | number:2}}</td>
<td class="text-right light-blue">{{(location.waterSupply == vm.constant.NO_WATER_SUPPLY)?'-':location.waterSupply | number:2}}</td>
<td class="text-right light-blue" ng-if="location.waterDemand != vm.constant.NO_WATER_SUPPLY && location.waterDeficit != vm.constant.NO_WATER_SUPPLY">{{(location.waterDeficit == vm.constant.NO_WATER_SUPPLY)?'-':location.waterDeficit | number:2}} ({{(location.waterDemand != 0)?((location.waterDeficit*100)/location.waterDemand):0 | number:2}}%)</td>
<td class="text-right light-blue" ng-if="location.waterDemand == vm.constant.NO_WATER_SUPPLY || location.waterDeficit == vm.constant.NO_WATER_SUPPLY">{{(location.waterDeficit == vm.constant.NO_WATER_SUPPLY)?'-':(location.waterDeficit | number:2)}}</td>
<td class="text-right light-orange">{{vm.getStressValue(location.locationStressIndicator)}}</td>
<td class="text-right light-orange">{{location.impactedPopulation | number}}</td>
<td class="text-right light-blue">{{location.numOfTankersAsOfToday | number}}</td>
<td class="text-right light-blue">{{location.numOfTankersForToday | number}}</td>
<td></td>
</tr>
根据类的描述,表中的最后一行应分别改为所提到的背景颜色,文本颜色和字体权重。但它并没有改变,最后一行是整个桌子的颜色。如何解决这个问题?
你可以显示什么表结构吗? –
它的确如此小提示所示:https://jsfiddle.net/4tvovto7/1/ - 你能向我们展示结果表吗?你错过了课程名称?或者tbody? – lumio
请给我们一个完全可重复的例子...我们也需要
回答
这会为最后一排
来源
2017-09-13 07:53:38 Gattbha
工作,因为我看到你正在使用的引导
table-striped
,也许它的风格将覆盖您的自定义样式。所以要确保添加!important
并检查它是否显示。 (使用!重要的是不是很好的练习一般)来源
2017-09-13 07:54:02 1011sophie
相关问题