zoukankan      html  css  js  c++  java
  • jquery mobile (一)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <link href="../Resources/CSS/app.css" rel="stylesheet" type="text/css" />
        <link href="../Script/jquery.mobile-1.3.2/css/themes/default/jquery.mobile-1.3.2.min.css"
            rel="stylesheet" type="text/css" />
        <script src="../Script/jquery-1.7.2.min.js" type="text/javascript"></script>
        <script src="../Script/jquery.mobile-1.3.2/js/jquery.mobile-1.3.2.min.js" type="text/javascript"></script>
    </head>
    <body>
        <div data-role="page" id="pageone">
            <div data-role="header" data-theme="b">
                <a href="#anylink">返回</a>
                <h1>
                    艺术墓</h1>
                <a href="#anylink">首页</a>
            </div>
            <div data-role="content">
                <form method="post">
                <div data-role="controlgroup" data-type="horizontal" id="search">
                    <input type="text" name="text" id="name" placeholder="协议号……">
                    <a href="#anylink" data-role="button">查询</a> <a href="#anylink" data-role="button">新建工程</a>
                </div>
                <div data-role="fieldcontain">
                </div>
                <div>
                    <ul data-role="listview">
                        <li data-role="list-divider" data-theme="d">业务信息</li>
                        <li>
                            <div data-role="fieldcontain">
    
    
                                <div class="ui-grid-a" data-role="controlgroup">
                                    <div class="ui-block-a"  style=" 50%; text-align:right;">
                                        <label>
                                            联系人:</label>
                                        <input type="text" name="contract" id="contract" >
                                    </div>
                                    <div class="ui-block-b" style=" 50%; text-align:right;">
                             
                                         <label>
                                    使用者姓名:</label>
                                <input type="text" name="uname" id="uname">
                                    </div>
                                </div>
    
                                <div class="ui-grid-a" data-role="controlgroup">
                                    <div class="ui-block-a"  style=" 50%; text-align:right;">
                               <label>
                                            联系电话:</label>
                                        <input type="text"  id="telphone"  >
                                   </div>
                                    <div class="ui-block-b" style=" 50%; text-align:right;">                                     
    
                                         <label>
                                    移动电话:</label>
                                <input type="text" name="phone" id="phone">
                                   </div>
                                </div>
                                <div class="ui-grid-a" data-role="controlgroup">
                                <div class="ui-block-a"  style=" 50%; text-align:right;">
                                <label>
                                    墓位:</label>
                                <input type="text" name="tombPostion" id="tombPostion">
                                 </div>
                                    <div class="ui-block-b" style=" 50%; text-align:right;">
                                <label>
                                    安葬方式:</label>
                                <input type="text" name="way" id="way">
                                      </div>
                                </div>
    
                            </div>
                        </li>
                        <li data-role="list-divider" data-theme="d">艺术墓加工流程</li>
                        <li>
                            <div data-role="collapsible" data-content-theme="c" data-iconpos="right">
                                <h1>
                                    确认最终艺术墓面积及价格</h1>
                                <p>
                                    <div data-role="fieldcontain">
                                        <label for="FeeItem">
                                            墓位款</label>
                                        <input type="text" name="FeeItem" id="FeeItem">
                                        <label for="FeeItem-material">
                                            墓碑材料费</label>
                                        <input type="text" name="FeeItem-material" id="FeeItem-material">
                                        <label for="FeeItem-final">
                                            最终墓价</label>
                                        <input type="text" name="FeeItem-final" id="FeeItem-final">
                                        <label for="FeeItem-area">
                                            面积</label>
                                        <input type="text" name="FeeItem-area" id="FeeItem-area">
                                        <div style="margin-bottom: 20px;">
                                        </div>
                                        <label for="FeeItem-labour">
                                            墓穴工料费</label>
                                        <input type="text" name="FeeItem-labour" id="FeeItem-labour">
                                        <label for="FeeItem-management">
                                            墓穴管理费</label>
                                        <input type="text" name="FeeItem-management" id="FeeItem-management">
                                        <label for="FeeItem-rent">
                                            墓穴租赁费</label>
                                        <input type="text" name="FeeItem-rent" id="FeeItem-rent">
                                        <br />
                                        <a href="#" data-role="button" data-inline="true" data-rel="dialog">打印交款单</a> <a
                                            href="#" data-role="button" data-inline="true" data-rel="dialog">确认</a>
                                    </div>
                                </p>
                            </div>
                            <!-- 折叠打开 data-collapsed="false"-->
                            <div data-role="collapsible" data-content-theme="c" data-iconpos="right">
                                <h1>
                                    艺术墓施工单下发确认</h1>
                                <p>
                                    <div data-role="fieldcontain">
                                        <label for="taketime">
                                            下发时间</label>
                                        <input type="text" name="taketime" id="taketime">
                                        <label for="upload-picture">
                                            上传施工图</label>
                                        <input type="text" name="upload-picture" id="upload-picture">
                                        <label for="file">
                                            文件:</label>
                                        <label name="file">
                                            上传成功</label>
                                        <a href="#">下载</a><br />
                                        <a href="#" data-role="button" data-inline="true" data-rel="dialog">打印加工单</a> <a
                                            href="#" data-role="button" data-inline="true" data-rel="dialog">确认</a>
                                    </div>
                                </p>
                            </div>
                            <div data-role="collapsible" data-content-theme="c" data-iconpos="right">
                                <h1>
                                    艺术墓加工返回时间确认</h1>
                                <p>
                                    <div data-role="fieldcontain">
                                        <label for="complete">
                                            完工时间</label>
                                        <input type="text" name="complete" id="complete">
                                        <label for="upload-tomb-picture">
                                            上传墓型照片</label>
                                        <input type="text" name="upload-tomb-picture" id="upload-tomb-picture">
                                        <a href="#" data-role="button" data-inline="true" data-rel="dialog">确认</a>
                                    </div>
                                </p>
                            </div>
                        </li>
                    </ul>
                    <br />
                    <a href="#" data-role="button">提交</a>
                </div>
                </form>
            </div>
            <div data-role="footer" data-theme="b">
                <h1>
                </h1>
            </div>
        </div>
    </body>
    </html>

    显示效果

  • 相关阅读:
    一只特立独行的猪
    每天写出好代码的5个建议
    电脑修好了
    VB编程修改AutoCAD长度型尺寸标注
    前天我放学回家
    VB编程修改AutoCAD坐标型尺寸标注
    VB编程操作AutoCAD尺寸标注样式
    这是一个错误的程序
    2011年6月27日星期二
    2011年6月20日星期一
  • 原文地址:https://www.cnblogs.com/siyunianhua/p/3948844.html
Copyright © 2011-2022 走看看