移动端jqueryMobile日期插件

今天网上down了一下移动端jqueryMobile日期插件 ,可以是想修改一下样式,不知道怎么修改,请大神帮忙看下;
演示效果可以看下这里我这与的:http://www.erdangjiade.com/js...
效果图如下想修改为橙色的:
big.jpg

代码如下:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <!-- 开始设置桌面图标,自适应屏幕   -->
        <title>移动端jqueryMobile日期插件 - 站长素材</title>
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <meta name="viewport" content="width=device-width,initial-scale=1, minimum-scale=1.0, maximum-scale=1, user-scalable=no">
        <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no,maximum-scale=1.0">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/icon-72.png">
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/icon-144.png">
        <link rel="apple-touch-startup-image" sizes="1024x748" href="images/icon-1024x748.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)">
        <!-- 结束设置桌面图标,自适应屏幕   -->
        
        <!-- jqueryMobile的css文件  -->
        <link rel="stylesheet" href="css/jqueryMobile.css">
        <!-- 加载jquery文件 -->
        <script type="text/javascript" src="js/jquery.js"></script>
        <!-- 加载jqueryMobile文件 -->
        <script type="text/javascript" src="js/jqueryMobile.js"></script>
        
        <!--mobiscroll日期插件-->
        <link href="css/mobiscroll.css" rel="stylesheet" type="text/css" />
        <script src="js/mobiscroll.js" type="text/javascript"></script>
        <script type="text/javascript">
            // 初始化插件内容
            var opt_data = {
                preset: 'date', //日期格式 date(日期)|datetime(日期加时间)
                theme: 'jqm', //皮肤样式
                display: 'modal', //显示方式
                mode: 'clickpick', //日期选择模式
                dateFormat: 'yy-mm-dd', // 日期格式
                setText: '确定', //确认按钮名称
                cancelText: '取消',//取消按钮名籍我
                dateOrder: 'yymmdd', //面板中日期排列格式
                dayText: '日', monthText: '月', yearText: '年', //面板中年月日文字
                yearText: '年', monthText: '月',  dayText: '日',  //面板中年月日文字
                endYear:2020, //结束年份
                showNow:true,
                nowText:'今天',
                hourText:'小时',
                minuteText:'分'
            };
            // 使用定义插件
            $(document).on("pageinit", "#pageone", function(){
                $("#txtBirthday").mobiscroll(opt_data);
                
            });
        </script>        
    </head>
    <body>
        <div data-role="page" id="pageone">
            <div data-role="header" data-position="fixed" data-theme="b">
                <h1>系统登录界面</h1>
            </div>
            <div data-role="content">
                <h2 style="color: #468dcc">请输入正确信息</h2>
                <form method="post" action="index.php">
                    <label for="username">用户名</label>
                    <input type="text" name="username" id="username" />
                    <label for="password">密码</label>
                    <input type="password" name="password" id="password" />
                    <label for="system">选择系统</label>    
                    <select id="system" name="system" data-native-menu="false">
                        <option selected>血液透析信息管理系统</option>
                        <option>生物样本库管理系统</option>
                        <option>腹膜透析管理系统</option>
                    </select>
                    <input type="button" name="zhuce" value="注 册" data-inline="true" />
                    <input type="submit" name="sub" value="提 交" data-inline="true" class="ui-btn-right" />
                    <!-- 日期插件 -->
    <label for="txtBirthday">登录时间:</label>
    <input type="text" data-role="datebox" id="txtBirthday" name="txtBirthday" />
                
                
                </form>
            </div>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p>
<p>来源:<a href="http://www.erdangjiade.com/" target="_blank">站长素材</a></p>
</div>
        </div>
</body>
</html>
阅读 5.8k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题