jqueryUI 日历 datepicker

<div id="calenderDiv" class="fl">

$(document).ready(
 ???function(){
 ???????$("#calenderDiv").datepicker();
 ???}
);

.ui-datepicker {
 ???width: 23em;
}
.ui-widget-header {
 ???background: #36474f;
 ???color: #ffffff;
}
.ui-datepicker .ui-datepicker-header {
 ???position: relative;
 ???padding-top: 0.4em;
 ???padding-right: 0px;
 ???padding-bottom: 0.4em;
 ???padding-left: 0px;
}
.ui-widget-header .ui-icon {
 ???background-image: url(images/ui-icons_444444_256x240.png);
}
.ui-widget-content {
 ???border: 1px solid #ddd;
//background: #eb6100;
 ???color:#ffffff;
}
.ui-datepicker-calendar thead tr{
 ???background: #eb6100;
}
.ui-widget-header {
 ???border: none;}
.ui-datepicker td span, .ui-datepicker td a {
 ???text-align: center;
 ???line-height: 2.5em;
}
.ui-datepicker table {
 ???font-size: 1em;
}
.ui-widget-header .ui-state-hover{
 ???border: 1px solid #ccc;
 ???margin-bottom: 2px;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
 ???position: absolute;
 ???top: 5px;}

.ui-widget-content .ui-state-active{
 ???border:none;
 ???background: #35464d;
 ???font-size:1em;
 ???color: #ffffff;}

.ui-widget-content .ui-state-highlight {
 ???border: 1px solid #f1a899;
 ???background: #f1a899;}
.ui-datepicker-week-end .ui-state-default{
 ???color:#c83b4c;
}
.ui-datepicker .ui-state-default{
 ???margin:0px;
 ???padding:0px;
 ???border:none;
// width:3.8em;
 ???height:2.5em;
 ???font-weight:bold;
 ???font-size: large;
}

jqueryUI 日历 datepicker

原文地址：http://www.cnblogs.com/yanglife/p/7639892.html