Community Learn Tools Library Leisure
search
English
Home > List of blog posts > 0319作业
Blogger Information
Blog 18
fans 1
comment 0
visits 12206
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
0319作业
木樨
Original
505 people have browsed it

制作课程表

  1. <!DOCTYPE html>
  2. <html lang="en">
  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="80%" cellspacing="0" cellpadding="5" align="center">
  11.       <caption>
  12.         <h3>学生课程表</h3>
  13.       </caption>
  14.       <thead>
  15.         <tr bgcolor="lightskyblue">
  16.           <th>时间</th>
  17.           <th>星期一</th>
  18.           <th>星期二</th>
  19.           <th>星期三</th>
  20.           <th>星期四</th>
  21.           <th>星期五</th>
  22.         </tr>
  23.       </thead>
  24.       <!-- 上午的课程 -->
  25.       <tbody align="center">
  26.         <tr>
  27.           <td rowspan="4" bgcolor="lightblue">上午</td>
  28.           <td>英语</td>
  29.           <td>语文</td>
  30.           <td>数学</td>
  31.           <td>历史</td>
  32.           <td>地理</td>
  33.         </tr>
  34.         <tr>
  35.           <td>英语</td>
  36.           <td>语文</td>
  37.           <td>数学</td>
  38.           <td>历史</td>
  39.           <td>地理</td>
  40.         </tr>
  41.         <tr>
  42.           <td>英语</td>
  43.           <td>语文</td>
  44.           <td>数学</td>
  45.           <td>历史</td>
  46.           <td>地理</td>
  47.         </tr>
  48.         <tr>
  49.           <td>英语</td>
  50.           <td>语文</td>
  51.           <td>数学</td>
  52.           <td>历史</td>
  53.           <td>地理</td>
  54.         </tr>
  55.       </tbody>
  56.       <tbody>
  57.         <tr bgcolor="lightgreen" align="center">
  58.           <td colspan="6">中午休息</td>
  59.         </tr>
  60.       </tbody>
  61.       <tbody>
  62.         <tr>
  63.           <td rowspan="2" bgcolor="lightblue">下午</td>
  64.           <td>英语</td>
  65.           <td>语文</td>
  66.           <td>数学</td>
  67.           <td>历史</td>
  68.           <td>地理</td>
  69.         </tr>
  70.         <tr>
  71.           <td>英语</td>
  72.           <td>语文</td>
  73.           <td>数学</td>
  74.           <td>历史</td>
  75.           <td>地理</td>
  76.         </tr>
  77.       </tbody>
  78.       <tfoot>
  79.         <tr bgcolor="lightSgray">
  80.           <td>备注：</td>
  81.           <td colspan="5">在15:00-16:00自习写作业，写完作业在回家</td>
  82.         </tr>
  83.       </tfoot>
  84.     </table>
  85.   </body>
  86. </html>
简单表单的制作
  1. <!DOCTYPE html>
  2. <html lang="en">
  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="" method="get">
  11.       <!-- 单行文本框 -->
  12.       <div>
  13.         <lable for="username">账号：</lable>
  14.         <input type="text" id="username" required placeholder="必填项" />
  15.       </div>
  16.       <!-- 密码框 -->
  17.       <div>
  18.         <lable for="password">密码：</lable>
  19.         <input type="password" id="password" required placeholder="必须是字母+数字"/>
  20.       </div>
  21.       <!-- 邮件文本框 -->
  22.       <div>
  23.         <lable for="emil">邮箱：</lable>
  24.         <!-- placeholder提示信息占位符 -->
  25.         <input type="emil" id="emil" placeholder="demo@mail.com" />
  26.       </div>
  27.       <!-- 整值文本框 -->
  28.       <div>
  29.         <lable for="number">年龄：</lable>
  30.         <input type="number" id="number" value="18" />
  31.       </div>
  32.       <!-- 单选按钮:多选一 -->
  33.       <div>
  34.         <lable for="username">性别：</lable>
  35.         <input type="radio" name="gender" value="male" id="male" checked /><label for="male">男</label>
  36.         <input type="radio" name="gender" value="female" id="female" /><label for="female">女</label>
  37.         <input type="radio" name="gender" value="secret" id="secret" /><label for="secret">保密</label>
  38.       </div>
  39.       <!-- 复选框 -->
  40.       <div>
  41.         <lable for="username">兴趣爱好：</lable>
  42.         <!-- 因为允许同时提交多个值，所以name属性要写成数组格式 -->
  43.         <input type="checkbox" name="hobby[]" value="game" id="game" checked/><label for="game">打游戏</label>
  44.         <input type="checkbox" name="hobby[]" value="draw" id="draw" checked/><label for="draw">画画</label>
  45.         <input type="checkbox" name="hobby[]" value="book" id="book" /><label for="book">读书</label>
  46.         <input type="checkbox" name="hobby[]" value="sport" id="sport" /><label for="sport">运动</label>
  47.       </div>
  48.       <!-- 下拉列表 -->
  49.       <div>
  50.         <label for="education">学历：</label>
  51.         <select name="education" id="education">
  52.           <option value="1">高中</option>
  53.           <option value="2">大专</option>
  54.           <option value="3">专科</option>
  55.           <option value="4">本科</option>
  56.         </select>
  57.       </div>
  58.       <!-- 提交按钮 -->
  59.       <div>
  60.         <button type="submit">提交</button>
  61.       </div>
  62.     </form>
  63.   </body>
  64. </html>
Correcting teacher：天蓬老师天蓬老师

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