Bootstrap Datepicker - 月份和年份没有间距

Question

我正在使用来自 http://eternicode.github.io/bootstrap-datepicker/ 的 Bootstrap 日期选择器，在示例中，他们显示了它的格式，并以网格样式很好地显示了月份和年份之间的间距.

但是，使用他们的 js 和 css 文件，月份和年份都显示在一起，请参阅下面的图片作为参考。

为了正确显示，我是否缺少任何选项或内容。

谢谢

西蒙

Answer 1

检查控制台中是否没有 JavaScript 错误。也许您的脚本中还有其他内容会破坏日期选择器。 如果没有错误，请确保 boostrap 的 JS 和 CSS 文件都已正确加载。 希望它有效！

• 尼克

Answer 2

我在 2021 年使用 Bootstrap 5 和 Datapicker 版本 1.9 也遇到了同样的问题

我在 CSS 或页面本身中添加了这个样式指令，因为几年和几十年都在一个跨度内，嵌入在一个 div 内的表行中（并不是真正的“boostrap 思维”，但日期选择器现在可能要旧得多比核心 Boostrap 框架...）。

<style>
    div.datepicker-years span{
         margin-left: 5px; 
         margin-right: 5px; 
    }
</style> 

根据您的方便调整指令（此示例仅适用于年份屏幕）。

Answer 3

在页面上使用以下脚本，假设您的输入字段名称为

dob

并使用

id="date" type="text"

:

$(document).ready(function(){
    var date_input=$('input[name="dob"]'); 
    var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
    date_input.datepicker({
        format: 'dd/mm/yyyy',
        container: container,
        todayHighlight: true,
        autoclose: true,
    })
})