Bootstrap DateTime 选取器上的小字体

Small fonts on Bootstrap DateTime picker

本文关键字：字体 DateTime 选取 Bootstrap      更新时间：2023-09-26

我正在使用 Bootstrap 3 DateTime 选择器 www.github.com/Eonasdan/bootstrap-datetimepicker

一切都工作正常，除了我需要使用小字体和日历网格线之间的间距较小。

有没有人知道如何做到这一点。这是原始代码：

<div class="small">
    <div id="myPlaceholder"></div>
</div>

在Javascript上：

 $('#myPlaceholder').datetimepicker({
                language : 'en'
            });

它运行良好，但不显示小字体。

您只需要添加自己的 CSS 来设置日期选择器的样式。

这将使列更窄：

.bootstrap-datetimepicker-widget td.day {
    width: 200px;
}

这将使行更短：

.bootstrap-datetimepicker-widget td.day {
    line-height: 10px;
}

这使得日期数字的字体更小：

.bootstrap-datetimepicker-widget td.day {
    font-size: 10px;
}

并将它们全部组合在一起：

.bootstrap-datetimepicker-widget td.day {
    width: 200px;
    line-height: 10px;
    font-size: 10px;
}

作为奖励，这将使星期几的字体大小变小：

th.dow {
    font-size: 12px;
}
相关文章：