欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

前端基础,表单、表格

程序员文章站 2023-12-21 17:34:10
...

前端基础,表单、表格表格作业代码

<!DOCTYPE html><html>    <head>        <meta charset="utf-8" />        <meta name="viewport" content="width=device-width, initial-scale=1">        <title>表格作业</title>        <style type="text/css">            table{                border-collapse: collapse;                width: 800px;                margin: 0 auto;            }            .t-head{                background-color: RGB(162,200,236);                height: 15px;            }            .yixiang{                background-color: RGB(230,239,254);            }        </style>    </head>    <body>        <table border="1" cellspacing="0" cellpadding="4">            <tr>                <th class="t-head" colspan="6"></th>            </tr>            <tr>                <td colspan="4" class="yixiang">--- 基&nbsp;&nbsp;本&nbsp;&nbsp;资&nbsp;&nbsp;料 ---</td>                <td rowspan="8" width="200"></td>            </tr>            <tr>                <td>姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名:</td>                <td>中文网</td>                <td>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别:</td>                <td>未知</td>            </tr>            <tr>                <td>学&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;历:</td>                <td>小学</td>                <td>身&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;高:</td>                <td>CM</td>            </tr>            <tr>                <td>籍&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;贯:</td>                <td>广东</td>                <td>出身年月:</td>                <td>1999-09-09</td>            </tr>            <tr>                <td>毕业院校:</td>                <td colspan="3">汕头大学</td>            </tr>            <tr>                <td>主修专业:</td>                <td colspan="3">前端 => 大前端</td>            </tr>            <tr>                <td>工作经验:</td>                <td>未知</td>                <td>目前年薪:</td>                <td>保密</td>            </tr>            <tr>                <td>有效证件:</td>                <td>身份证</td>                <td>证件号码:</td>                <td>******************</td>            </tr>            <tr>                <td colspan="5" class="t-head"></td>            </tr>            <tr>                <td colspan="5" class="yixiang">--- 求&nbsp;&nbsp;职&nbsp;&nbsp;意&nbsp;&nbsp;向 ---</td>            </tr>            <tr>                <td>寻求职位:</td>                <td colspan="4">前端开发</td>            </tr>            <tr>                <td>求职地区:</td>                <td colspan="2">罗湖区&nbsp;&nbsp;福田区</td>                <td>工资待遇:</td>                <td>面议</td>            </tr>            <tr>                <td>自我评价:</td>                <td colspan="4">做事塌实认真,能吃苦耐劳;学习潜力强,能够很快的理解新事物;性格开朗,诚实正直,谦和自信,乐于进取乐于奉献,勤奋好学,用心上进,有较强的社会适应潜力。工作踏实,认真细致,具有强烈的事业心和工作职责心,善于处理人际关系,具有极佳的团队合作精神。</td>            </tr>            <tr>                <td colspan="5" class="t-head"></td>            </tr>            <tr>                <td colspan="5">--- 教&nbsp;&nbsp;育&nbsp;&nbsp;培&nbsp;&nbsp;训 ---</td>            </tr>            <tr align="center">                <td colspan="2">起止时间</td>                <!-- <td></td> -->                <td colspan="">院校名称</td>                <td colspan="">主修专业</td>                <td colspan="">学历</td>            </tr>            <tr align="center">                <td colspan="2">2009.09~2012.07</td>                <td colspan="">汕头大学</td>                <td colspan="">计算机</td>                <td colspan="">中专</td>            </tr>            <tr>                <td colspan="5" class="t-head"></td>            </tr>            <tr>                <td colspan="5" class="yixiang">--- 工&nbsp;&nbsp;作&nbsp;&nbsp;经&nbsp;&nbsp;验 ---</td>            </tr>            <tr align="center">                <td>就职公司:</td>                <td colspan="2">深圳电路有限公司</td>                <td>公司行业:</td>                <td colspan="">其他</td>            </tr>            <tr>                <td align="center">就职时间:</td>                <td align="center" colspan="2">2011年12月至今</td>                <td align="center">就职部门:</td>                <td align="center" colspan="">技术部</td>            </tr>            <tr>                <td align="center">工作描述:</td>                <td colspan="4">成绩属于过去,未来仍需努力,今后会不断总结经验,改进不足,并不断学习各种专业知识,加强自我修养,提高业务和管理水平,在未来的人生道路上努力拼搏,勇敢开拓,再铸辉煌,为工程咨询事业灿烂的明天和美好的未来而奉献毕生精力。</td>            </tr>            <tr>                <td class="t-head" colspan="5"></td>            </tr>            <tr>                <td colspan="5" class="yixiang">--- 联&nbsp;&nbsp;系&nbsp;&nbsp;方&nbsp;&nbsp;式 ---</td>            </tr>            <tr>                <td>联系电话:</td>                <td colspan="4">181********</td>            </tr>            <tr>                <td>联络手机:</td>                <td colspan="4">181********</td>            </tr>            <tr>                <td>电子邮件:</td>                <td colspan="4"><span style="text-decoration: underline;">123456789@163.com</span></td>            </tr>            <tr></tr>        </table>    </body></html>

前端基础,表单、表格表格作业效果图

前端基础,表单、表格

前端基础,表单、表格表单作业代码

<!DOCTYPE html><html>    <head>        <meta charset="utf-8">        <title>作业表单练习</title>        <style type="text/css">            form{                border: 1px solid black;                width: 300px;                padding: 10px;                margin: 0 auto;            }            input{                margin: 10px auto;            }            select{                margin: 10px auto;            }            textarea{                margin: 10px auto;            }            button{                margin: 10px auto;                width: 60px;                height: 30px;            }            .btn2{                background-color: white;                border: 1px solid gray;                border-radius: 10px;            }        </style>    </head>    <body>        <form action="login.php" method="post" style="display: block;">            <legend>用户注册</legend>            账号:<input type="text" name="" id="" value="" placeholder="不超过8个字符" maxlength="16" />            <br>            密码:<input type="password" name="" id="" value="" placeholder="6-16个字符" maxlength="16" />            <br>            邮箱:<input type="text" name="" id="" value="" placeholder="example@mail.com" />            <br>            年龄:<input type="number" name="" id="" value="" />            <br>            生日:<input type="date" name="" id="" value="" />            <br>            课程:            <select>                <option value="html">html</option>                <option value="css">css</option>                <option value="javascript">javascript</option>            </select>            <br>            爱好:                <input type="checkbox" name="habit" id="game" value="game">                <label for="game">打游戏</label>                <input type="checkbox" name="habit" id="movie" value="movie">                <label for="movie">看电影</label>                <input type="checkbox" name="habit" id="code" value="code">                <label for="code">撸代码</label>                <br>            性别:                <input type="radio" name="sex" id="male" value="male">                <label for="male">男</label>                <input type="radio" name="sex" id="female" value="female">                <label for="female">女</label>                <input type="radio" name="sex" id="secret" value="secret">                <label for="secret">保密</label>                <br>            简介:                <textarea rows="5" cols="30"></textarea>                <br>                <button type="button">提交</button>                <button type="button" class="btn2">Ajax</button>        </form>    </body></html>

前端基础,表单、表格表单作业效果

前端基础,表单、表格

上一篇:

下一篇: