如何调整引导的DatePicker？

HTML：

<div class="input-append date datepicker no-padding" data-date-format="dd-mm-yyyy"> 
    <input class="input-medium" size="16" type="text"><span class="add-on"><i class="icon-th"></i></span> 
</div>

的Javascript：

$(document).ready(function() { 
    $('.datepicker').datepicker({ 
     autoclose: true, 
     startDate: new Date() 
    }); 
});

演示：jsfiddle

我想改变引导日期选择器的尺寸

任何建议，以解决我的问题

谢谢

来源

2016-01-22 moses toh

@Maddy [有一个内置的编辑器...]（http://meta.stackoverflow.com/questions/314602/inform-the-users-about-the-existence-的堆栈 - 摘录，同时要求时，外部） –

可以使用.datepicker和.table-condensed选择控制宽度：

$(document).ready(function() { 
 
    $('.datepicker').datepicker({ 
 
    autoclose: true, 
 
    startDate: new Date() 
 
    }); 
 
});

.datepicker, 
 
.table-condensed { 
 
    width: 500px; 
 
    height:500px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.0/css/bootstrap.min.css" rel="stylesheet" /> 
 
<link href="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/css/datepicker.css" rel="stylesheet" /> 
 
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.0/js/bootstrap.min.js"></script> 
 
<script src="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.js"></script> 
 
<div class="input-append date datepicker no-padding" data-date-format="dd-mm-yyyy"> 
 
    <input class="input-medium" size="16" type="text"><span class="add-on"><i class="icon-th"></i></span> 
 
</div>

您需要同时适用，因为.table-condensed有max-width:100%。如果你摆脱这个你可以控制使用.datepicker

来源

2016-01-22 08:08:34

@TJ，非常感谢你。我不工作。我想再问一次。是否可以更改日期选择器高度？ –

@mosestoh增加将正常工作，我更新了这个例子。然而，它的最小高度大约在200像素左右，以便在200像素处显示很多行......您必须从“”中删除填充。如果你想要低于这个水平，你将不得不做更进一步的定制，比如改变字号 –

@T J，非常感谢你 –

这里是紧箍咒，对我行之有效的大小。它在大多数浏览器中都表现良好。

.datepicker, 
.table-condensed { 
    width: 220px; 
    height: 220px; 
    font-size: x-small; 
}

基本上，它显示缩小的引导日期选择器的大小。

来源

2017-02-02 05:17:11 Roberto

就我而言，我只是想给日期输入提供与其他输入一样的高度。这条线解决了它：

$('input[type="date"]').height($('input').height());

来源

2017-10-09 09:16:50 siderio2

如何调整引导的DatePicker？

回答

相关问题