如何覆盖bootstrap表td样式?

时间:2014-12-20 10:53:04

标签: html css css3 twitter-bootstrap

我使用的是Bootstrap 3.3
我有一个HTML代码如下:

<div data-name="md-PersianDateTimePicker">
    <table class="table table-striped">        
        <tr>
            <td data-name="day">03</td>
            <td data-name="day">04</td>
            <td data-name="day">05</td>
            <td data-name="day">06</td>
            <td data-name="day">07</td>
            <td data-name="day">09</td>
            <td data-name="day" class="text-danger">09</td>
        </tr>
        .
        .
        .
    </table>
</div>

如何为每个padding:2px设置td

我测试了以下内容,它不起作用!

[data-name="md-PersianDateTimePicker"] td{ 
   padding: 2px;
}

2 个答案:

答案 0 :(得分:3)

只需增加选择器的specificity即可。如果您当前的工作不起作用,请尝试将表格添加到其中:

[data-name="md-PersianDateTimePicker"] table.table.table-striped td[data-name="day"] {
    padding: 2px;
}

答案 1 :(得分:1)

添加!important说明符

[data-name="md-PersianDateTimePicker"] td{ 
   padding: 2px !important;
}

DEMO FIDDLE

注意

  

永远不要在网站范围内使用!important。只使用!important on   页面特定的css覆盖站点范围或外部css