更改bootstrap datepicker的文本或背景颜色

时间:2014-12-01 13:44:32

标签: jquery css html5 twitter-bootstrap

我已经实现了引导日期选择器(见下图)。它按预期工作。代码如下所示:

<div class="input-group date">
    <input name="departure" type="text" class="form-control" id="departure" required>
    <span class="input-group-addon">
        <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
    </span>
</div>

实施日期选择器的代码:

$(document).ready(function () {
    $('.input-group.date').datepicker({
        format: "yyyy/mm/dd",
        startDate: "2014-12-01",
        endDate: "2016-01-01",
        todayBtn: "linked",
        autoclose: true,
        todayHighlight: true
    });
});

日期选择器:

dtp

当我更改HTML页面的背景颜色时:

body {
    background: #EDEDED !important; /* RGB Decimal :237, 237, 237 */
    color: #965B25 !important; /* RGB Decimal :150, 91, 37 */
}

日期选择器中的文本也会更改。结果是您无法读取日期选择器框中的任何文本。 有没有办法更改日期选择器本身的文字颜色/背景颜色?

任何帮助都非常适合。

马库斯

2 个答案:

答案 0 :(得分:4)

试试这个:

.datepicker {
background-color: #fff ;
color: #333 ;
}

答案 1 :(得分:0)

我遇到的Bootstrap3 datetimepicker也遇到了同样的问题,我做了以下更改并且工作正常

  $('.datepicker').on(
        'dp.show',
        function(e) {
        $(".bootstrap-datetimepicker-widget").css(
        "background-color", "#3c3e43");
        });