关于表格和表单的简易写法

如何做出一张八行六列的课程表？
准备工具：
vscode编译器
FastStone Capture取色器，用于颜色选取


<table border="1px" cellspacing="0px" cellpadding="5px" height="250px" width="450px">

<caption style="font-weight: bold">
周一至周五课程安排
</caption>

<thead>
<tr bgcolor="#DEFEFF">
<th>时间</th>
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
<th>周五</th>
</tr>
</thead>

  <!-- 内容 -->
  <tbody align="center">
    <!-- align=“cente”居中对齐 -->
    <!-- 第二行 -->
    <tr>
      <!-- 上午 -->
      <td rowspan="3" bgcolor="#87CEF8">上午</td>
      <td>语文</td>
      <td>计算机</td>
      <td>数学</td>
      <td>美术</td>
      <td>体育</td>
    </tr>
    <!-- 第三行 -->
    <tr>
      <td>计算机</td>
      <td>语文</td>
      <td>体育</td>
      <td>数学</td>
      <td>英语</td>
    </tr>
    <!-- 第四行 -->
    <tr>
      <td>体育</td>
      <td>数学</td>
      <td>英语</td>
      <td>语文</td>
      <td>计算机</td>
    </tr>
    <!-- 第五行 -->
    <tr>
      <td colspan="6" bgcolor="#DEDEDE">午间休息</td>
    </tr>
    <!-- 第六行 -->
    <tr>
      <td rowspan="2" bgcolor="#87CEF8">下午</td>
      <td>英语</td>
      <td>语文</td>
      <td>体育</td>
      <td>计算机</td>
      <td>数学</td>
    </tr>
    <!-- 第七行 -->
    <tr>
      <td>计算机</td>
      <td>语文</td>
      <td>英语</td>
      <td>数学</td>
      <td>体育</td>
    </tr>
  </tbody>
  <!-- 表格底部 -->
  <tfoot>
    <!-- 第八行 -->
    <tr bgcolor="#8FEE8F">
      <td>备注:</td>
      <td colspan="5">每天下午18：00-12：00，进行晚自习</td>
    </tr>
  </tfoot>
</table>

2、如何做出一张简易的用户注册表单？
准备工具：
vscode编译器

<div>

<h1>信息注册页面</h1>
<form action="" method="POST">





<label for="name">名字:</label>
<input type="text" id="name" />
<br /><br />


<label for="password">密码:</label>
<input type="password" name="" id="password" />
<br /><br />


<div>
<label for="">性别:</label>
<input type="radio" name="Gender" id="male" />
<label for="male">男</label>
<input type="radio" name="Gender" id="female" />
<label for="female">女</label>
<input type="radio" name="Gender" id="secrecy" />
<label for="secrecy">保密</label> <br /><br />
</div>

    <!-- 多选框 -->
    <label for="">爱好:</label>
    <input type="checkbox" name="" id="game" />
    <label for="game">游戏</label>
    <input type="checkbox" name="" id="read a book" />
    <label for="read a book">看书</label>
    <input type="checkbox" name="" id="Travel" />
    <label for="Travel">旅游</label>
    <input type="checkbox" name="" id="motion" />
    <label for="motion">运动</label>
    <input type="checkbox" name="" id="foodie" />
    <label for="foodie">吃货</label>
  </form>
  <br />
  <!-- 下拉列表 -->
  <label for="">星座:</label>
  <select name="constellation" id="">
    <option value="scorpio">天蝎座</option>
    <option value="aquarius">水瓶座</option>
    <option value="leo">狮子座</option>
    <option value="libra">天秤座</option>
    <option value="Gemini">双子座</option>
  </select>
  <br /><br />
  <!-- 邮件 -->
  <div>
    <label for="email">邮件:</label>
    <input type="email" name="" id="email" />
  </div>
  <br />
  <!-- 文本域 -->
  <label for="remarks:">备注：</label><br />
  <textarea name="remarks:" id="remarks:" cols="40" rows="10"></textarea>
  <div>
    <!-- 提交按钮 -->
    <input type="button" value="提交" />
  </div>
</div>

更多相关文章

随机推荐