工具/原料
bootstrap
Dreamweaver
方法/步骤
首先，我们将这款日期控件下载下来。百度bootstrap日期控件即可。
将下载好的日期控件的css、js引入自己的文件中。
在这里需要引入的文件有：
bootstrap.min.css（含有bootstrap 所有css）
bootstrap-datetimepicker.min.css（重要，这就是日期控件所需的样式表）
jquery-1.8.3.min.js（其他版本的jquery也可以）
bootstrap.min.js（含有bootstrap 所有js）
bootstrap-datetimepicker.js（重要，这就是日期控件所需的js）
locales/bootstrap-datetimepicker.fr.js（重要，这里是日期控件初始值）
将所有文件引入完成后，就开始设置日期控件吧。
这是第一种样式。当然，你可以只要input就可以了。
<div class="input-append date" id="datetimepicker" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
<input class="span2" size="16" type="text" value="12-02-2012">
<span class="add-on"><i class="icon-th"></i></span>
</div>
第二种样式，带有重置按钮（用于清空输入框）的组件模版：
<div class="input-append date" id="datetimepicker" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
<input class="span2" size="16" type="text" value="12-02-2012">
<span class="add-on"><i class="icon-remove"></i></span>
<span class="add-on"><i class="icon-th"></i></span>
</div>
i的作用就是两个小图标，若不要可以删去。
最简洁的样式，只有input,点击弹出选择器：
<input class="span2" size="16" type="text" value="12-02-2012">
当然，只有这些是无法弹出日期选择器的，还需要js来激活。
这里是最重要的一步，js激活日期选择器！
<script type="text/javascript">
$('你的input的class或id').datetimepicker({
//一堆参数
})
</script>
将这个写在你的页面内，至于参数，一会再介绍。这样就可以激活你的日期选择器了，点击input便可以弹出选择器。
日期选择器的参数设置：
format
weekStart
startDate
endDate
daysOfWeekDisabled
autoclose
startView
minView
maxView
todayBtn
todayHighlight
keyboardNavigation
language
forceParse
minuteStep
pickerPosition
viewSelect
showMeridian
initialDate
这些属性不用全部设置，但有些是必须的，比如format。
这里是小编所使用的一款日期选择器的初始化设置：
$('.date').datetimepicker({
format:yyyy-mm-dd,
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2,
forceParse: 0,
showMeridian: 1
})
bootstrap日期选择器的属性非常多，这也给了用户较大的选择性，快去设置你自己的DIY日期选择器吧！
在固定日期下选择其它单位的前端，可以采用以下四种方法：1. 使用JavaScript的“Date”对象，为前端应用程序创建一个简单的日期选择控件；
2. 使用第三方JavaScript框架和库，来实现日期选择器的简单、可配置化的控件；
3. 集成一些GUI控件，来实现更细节、更丰富的日期选择功能；
4. 使用CSS3中的日期输入字段，来更便捷地输入日期。
答：css失效的原因如下一、div 标签未关闭
这是版面设计失效的最常见原因之一。当我们了解到这是多少精致的版块设计失效的罪魁祸首时，总会大吃一惊。开启的div标签是最普遍的版块设计失误之一，也是最难诊断的失误之一。验证程序有时会指向错误的开启div标签，诊断时就像大海捞针一样麻烦。
二、不当的DOCTYPE声明
不声明DOCTYPE，或者在文件开始错误声明DOCTYPE，也是一个常见错误。根据一般经验，Strict DOCTYPE是大家追求的最高级验证。Strict validation表明你的网页能够在所有浏览器上都得到最佳展示。
三、结尾斜线
如果你的网站不能验证，很有可能是在代码的某个地方漏写了结尾斜线。我们很容易忽略结尾斜线之类的东西，特别是在image标签等元素中。
在严格的DOCTYPE中这是无效的。要在img标签结尾处加上“/”以解决此问题。
四、JavaScript
如果已经声明Strict DOCTYPE，就需要在JavaScript中覆盖CDATA标签。验证程序的这一方面难倒了很多程序员，因为网站倾向于为广告和追踪脚本使用嵌入的 JavaScript。
五、不良嵌套
嵌套就是元素里又包括元素，我们容易混淆嵌套元素的顺序。例如在div标签前启动strong标签，但又先关闭div标签。这可能不会改变版块布局，但却会使你的版块设计失效。
如果仍无法发现，建议用“开发者模式”/“调试模式”（F12打开）查看对应元素继承了哪些属性，是不是其他的样式覆盖了自己设置的样式。
