日期选择控件mobiscroll 自定义样式

1.0.2的版本默认黑色的主题，通过覆盖其css可自定义样式：
文件引入:
<link rel="stylesheet" type="text/css" href="${ctx}/scripts/mobiscroll/jquery.scroller-1.0.2.css" />

<script type="text/javascript" src="${ctx}/scripts/jquery/jquery-1.8.0.min.js"></script>

<script type="text/javascript" src="${ctx}/scripts/mobiscroll/jquery.scroller-1.0.2.js"></script>
样式修改：
/*时间空间颜色修改*/

/*顶部时间*/
.sense-ui .dwv{
border-bottom:1px solid;
color:#3B6EBD;
}
/*整体背景颜色*/
.sense-ui{
background: #fff;
}
/*中文颜色*/
.dwl{
color:#3B6EBD;
}
/*滚轮背景*/
.dww{
background: #fff;
}
.sense-ui .dwwc {
background: #fff;
}
/*按钮*/
.dwb:link{
color:#3B6EBD;
background: none;
text-shadow: none;
border: 1px solid;
-webkit-box-shadow:none;
}

/*数字上下的渐变颜色*/
.dwwo{
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(255, 255, 255)),color-stop(0.5, rgba(255, 255, 255,0)),color-stop(1, rgb(255, 255, 255)));
}
.dwwl{
background: none;
}
/*数字的颜色*/
.dww li{
text-shadow: none;
color: #3B6EBD;
/* font-weight: bold; */
}

/*数值中间一横*/
.dwwol{
border: none;
}

使用方法：

//时间控件
$(document).ready(function () {
$( "#date3" ).scroller({ preset: 'datetime',
seconds: false,
ampm : false,
dateOrder: 'yymd',
theme: 'sense-ui',
setText: '确定',
cancelText: '取消'
});

wheels = [];
wheels[0] = { '小时': {} };
wheels[1] = { '分钟': {} };
for (var i = 0; i < 60; i++) {
if (i < 16) wheels[0]['小时'][i] = (i < 10) ? ('0' + i) : i;
wheels[1]['分钟'][i] = (i < 10) ? ('0' + i) : i;
}

$( "#custom" ).scroller({
width: 90,
wheels: wheels,
formatResult: function (d) {
return ((d[0] - 0) + ((d[1] - 0) / 60)).toFixed(1);
},
parseValue: function (s) {
var d = s.split('.');
d[0] = d[0] - 0;
d[1] = d[1] ? ((('0.' + d[1]) - 0) * 60) : 0;
return d;
}
});
});

最终效果：