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

表格与表单

程序员文章站 2022-05-30 15:59:58
...

表格与表单    

<h3 style="margin-left: 100px">合肥市南门小学六年级课程表</h3>

    <table

      border="1"

      width="500"

      cellspacing="0"

      cellspadding="0"

      style="text-align: center"

    >

      <caption>

        <thead style="background-color: #e6e5e6">

          <tr>

            <th>时间</th>

            <th>周一</th>

            <th>周二</th>

            <th>周三</th>

            <th>周四</th>

            <th>周五</th>

          </tr>

        </thead>

        <tbody>

          <tr>

            <td rowspan="4" style="background-color: #e5f4f8">上午</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>数学</td>

            <td>数学</td>

            <td>数学</td>

            <td>数学</td>

            <td>数学</td>

          </tr>

          <tr>

            <td colspan="6">中午休息</td>

          </tr>

          <tr>

            <td rowspan="3" style="background-color: #e5f4f8">下午</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>

        </tbody>

        <tfoot style="background-color: #e6e5e6">


          <tr>

            <td>备注</td>

            <td colspan="5">每天下午15:30-17:30在校写完作业才可回家</td>

          </tr>

        </tfoot>

      </caption>

    </table>

表格与表单


<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="UTF-8" />

    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>表单</title>

  </head>

  <style type="text/css">

    fieldset {

      border-radius: 10px;

      overflow: hidden;

      float: left;

      background-color: #eee;

      box-shadow: 3px 1px 5px #888888;

    }

    legend {

      text-align: center;

    }

    button {

      margin: 5px 0 0 50px;

      width: 150px;

      border: none;

      padding: 3px;

      background-color: #247d56;

      color: white;

    }

  </style>

  <body>

    <!-- form +input + select + button... -->

    <!-- action:处理表单的程序 -->

    <form action="verify.php" method="post" widht="200">

      <fieldset widht="200px">

        <legend align="center">用户登录</legend>

        <label for="email">邮箱:</label>

        <input type="text" id="email" /><br />

        <label for="passworld">密码:</label>

        <input type="passworld" id="passworld" style="margin-top: 5px" /><br />

        <button type="submit">提交</button>

      </fieldset>

    </form>

  </body>

</html>