简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > List of blog posts > 表格制作与用户注册表单
Blogger Information
Blog 7
fans 0
comment 0
visits 2288
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
表格制作与用户注册表单
阿辉
Original
374 people have browsed it

作业/20230116

一、课程表

  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>课程表</title>
  8. </head>
  9. <body>
  10.     <table border="1" width="400">
  11.         <caption>课程表</caption>
  12.         <tr>
  13.             <th></th>
  14.             <th>周一</th>
  15.             <th>周二</th>
  16.             <th>周三</th>
  17.             <th>周四</th>
  18.             <th>周五</th>
  19.             <th>周六</th>
  20.             <th>周日</th>
  21.         </tr>
  22.         <tr>
  23.             <td>第一节</td>
  24.             <td>英语</td>
  25.             <td>英语</td>
  26.             <td>数学</td>
  27.             <td>语文</td>
  28.             <td>数学</td>
  29.             <td colspan="2" rowspan="10">休息日放假</td>
  30.         </tr>
  31.         <tr>
  32.             <td>第二节</td>
  33.             <td>语文</td>
  34.             <td>电脑</td>
  35.             <td>地理</td>
  36.             <td>生物</td>
  37.             <td>历史</td>
  38.         </tr>
  39.         <tr>
  40.             <td>第三节</td>
  41.             <td>体育</td>
  42.             <td>语文</td>
  43.             <td>英语</td>
  44.             <td>数学</td>
  45.             <td>体育</td>
  46.         </tr>
  47.         <tr>
  48.             <td>第四节</td>
  49.             <td>数学</td>
  50.             <td>语文</td>
  51.             <td>英语</td>
  52.             <td>历史</td>
  53.             <td>电脑</td>
  54.         </tr>
  55.         <tr>
  56.             <th colspan="6">午休：12:00-14:00</th>
  57.         </tr>
  58.         <tr>
  59.             <td>第五节</td>
  60.             <td>体育</td>
  61.             <td>数学</td>
  62.             <td>电脑</td>
  63.             <td>音乐</td>
  64.             <td>生物</td>
  65.         </tr>
  66.         <tr>
  67.             <td>第六节</td>
  68.             <td>地理</td>
  69.             <td>美术</td>
  70.             <td>道德</td>
  71.             <td>法治</td>
  72.             <td>音乐</td>
  73.         </tr>
  74.         <tr>
  75.             <td>第七节</td>
  76.             <td>班会</td>
  77.             <td>体育</td>
  78.             <td>历史</td>
  79.             <td>电脑</td>
  80.             <td>语文</td>
  81.         </tr>
  82.         <tr>
  83.             <td>第八节</td>
  84.             <td>自习</td>
  85.             <td>自习</td>
  86.             <td>自习</td>
  87.             <td>自习</td>
  88.             <td>自习</td>
  89.         </tr>
  90.         <tr>
  91.             <th colspan="6">休息：21:45-7:45</th>
  92.         </tr>
  93.     </table>
  94. </body>
  95. </html>

二、注册表单

  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4.   <meta charset="UTF-8">
  5.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.   <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.   <title>注册表单</title>
  8. </head>
  9. <body>
  10.   <form action="login.php" method="post">
  11.     <fieldset>
  12.       <legend>注册用户</legend>
  15.       <div class="username">
  16.         <label for="uname">用户名：</label>
  17.         <input type="text" name="username" id="uname" placeholder="请输入用户名（中文或英文）" autofocus required>
  18.       </div>
  20.       <div class="my-email">
  21.         <label for="my-email">邮　箱：</label>
  22.         <input type="email" name="email" id="my-email" placeholder="email@qq.com" required>
  23.       </div>
  25.       <div class="psw">
  26.         <label for="psw">密　码：</label>
  27.         <input type="password" name="password" id="psw" placeholder="******" required>
  28.       </div>
  30.       <div class="language">
  31.         <label>语　言：</label>
  32.         <input type="checkbox" name="language[]" id="php" value="php" checked> <label for="php">PHP</label>
  33.         <input type="checkbox" name="language[]" id="html" value="html"> <label for="html">HTMl</label>
  34.         <input type="checkbox" name="language[]" id="java" value="java"> <label for="java">Java</label>
  35.         <input type="checkbox" name="language[]" id="C++" value="C++"> <label for="C++">C++</label>
  36.         <input type="checkbox" name="language[]" id="python" value="python"> <label for="python">Python</label>
  37.       </div>
  39.       <div class="edu">
  40.         <label for="edu">学　历：</label>
  41.       <select name="edu" id="edu" form="">
  42.       <option value="0">初中</option>
  43.       <option value="1">高中</option>
  44.       <option value="2">专科</option>
  45.       <option value="3">本科</option>
  46.       <option value="4">硕士</option>
  47.       <option value="5">其他</option>
  48.       </select>
  49.       </div>
  50.       <button type="submit">注册</button>
  51.       <a href="demo2.html">已有用户？前往登录</a>
  52.     </fieldset>
  53.   </form>
  54. </body>
  55. </html>

总结

1.了解到了制作表格方法，水平、垂直合并属性。
2.学习了表单的重要性，常用标签与属性，id绑定，提交方式post、get。
autofocus=获取焦点（一个页面只能有一个），required=不能为空（输入框内容不允许空）

Correcting teacher：PHPzPHPz

Correction status：qualified

Teacher's comments：
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！