datepicker 样式 html,js/css改变日期控件的样式

.fr-datepicker table.dt,.fr-datepicker table.mt{border:#98c0f4 1px solid;}

.fr-datepicker thead tr.mainhead td{border-bottom:1px solid #98c0f4;}

.fr-datepicker table td.wn{border-right:1px solid #98c0f4;}

.fr-datepicker tfoot tr.optbtns td.btn{border-top:1px solid #98c0f4;}

.fr-datepicker td.time{border-top:#98c0f4 1px solid;}

相关的样式如上,初始化脚本：

var a=document.getElementById("frdatepickerpurpleborder");

if(!a){

var style = document.createElement('style');

style.type = 'text/css';

style.id='frdatepickerpurpleborder';

style.innerHTML=`

.fr-datepicker table.dt,.fr-datepicker table.mt{border:purple 1px solid;}

.fr-datepicker thead tr.mainhead td{border-bottom:1px solid purple;}

.fr-datepicker thead tr.mainhead td:hover{border:1px solid purple;}

.fr-datepicker table td.wn{border-right:1px solid purple;}

.fr-datepicker tfoot tr.optbtns td.btn{border-top:1px solid purple;}

.fr-datepicker tfoot tr.optbtns td.btn:hover{border:1px solid purple;}

.fr-datepicker td.time{border-top:purple 1px solid;}

`;

document.getElementsByTagName('HEAD').item(0).appendChild(style);

}