aaa片欧美,欧美丰满熟妇xxxx性,а√天堂资源地址在线官网bt

首頁 > 博客列表 > 寫一個美麗的課程表

博主信息

博文 11

粉絲 0

評論 0

訪問量 9806

專題推薦

更多>

相關(guān)推薦

熱門教程

更多>

相關(guān)教程

今天我們來看一個簡單的table標(biāo)簽實(shí)現(xiàn)的課程表

首先主要用到的標(biāo)簽元素有一下幾個
table-表格主題、caption-表格名稱、tr-行、td-列、thead-表頭（tr>th(表頭中用來表示列的標(biāo)簽)）tbody-表主體、tfoot-表頁腳

然后我們看一下，我們最終要呈現(xiàn)的樣子

實(shí)現(xiàn)代碼如下：

<!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>
    <style>
      .am {
        background-color: aquamarine;
      }
      .innoon {
        background-color: #db9cbc;
      }
      .pm {
        background-color: rgb(231, 228, 51);
      }
      .remarks {
        background-color: rgb(148, 185, 241);
      }
      td {
        text-align: center;
      }
    </style>
  </head>
  <body>
    <!-- table + caption + thead + tbody + tfoot -->
    <table border="1" width="500">
      <caption>山東省小學(xué)統(tǒng)一課程表</caption>
      <thead>
        <tr>
          <th>日期</th>
          <th>星期一</th>
          <th>星期二</th>
          <th>星期三</th>
          <th>星期四</th>
          <th>星期五</th>
        </tr>
      </thead>
      <tbody>
        <tr class="am">
          <td rowspan="4">上午</td>
          <td>數(shù)學(xué)</td>
          <td>語文</td>
          <td>英語</td>
          <td>數(shù)學(xué)</td>
          <td>體育</td>
        </tr>
        <tr class="am">
          <td>語文</td>
          <td>數(shù)學(xué)</td>
          <td>科學(xué)</td>
          <td>音樂</td>
          <td>美術(shù)</td>
        </tr>
        <tr class="am">
          <td>音樂</td>
          <td>美術(shù)</td>
          <td>數(shù)學(xué)</td>
          <td>數(shù)學(xué)</td>
          <td>數(shù)學(xué)</td>
        </tr>
        <tr class="am">
          <td>英語</td>
          <td>數(shù)學(xué)</td>
          <td>科學(xué)</td>
          <td>數(shù)學(xué)</td>
          <td>數(shù)學(xué)</td>
        </tr>
        <tr class="innoon">
          <td colspan="6">中午休息</td>
        </tr>
        <tr class="pm">
          <td rowspan="3">下午</td>
          <td>體育</td>
          <td>體育</td>
          <td>數(shù)學(xué)</td>
          <td>數(shù)學(xué)</td>
          <td>語文</td>
        </tr>
        <tr class="pm">
          <td>語文</td>
          <td>數(shù)學(xué)</td>
          <td>音樂</td>
          <td>體育</td>
          <td>數(shù)學(xué)</td>
        </tr>
        <tr class="pm">
          <td>科學(xué)</td>
          <td>數(shù)學(xué)</td>
          <td>數(shù)學(xué)</td>
          <td>數(shù)學(xué)</td>
          <td>音樂</td>
        </tr>
        <tfoot>
            <tr class="remarks">
                <td>備注 : </td>
                <td colspan="5">課程安排僅供參考</td>
            </tr>
        </tfoot>
      </tbody>
    </table>
  </body>
</html>

這樣一個漂亮的課程表就完成了！
你學(xué)廢了嗎^-^

批改老師：

PHPz

批改狀態(tài)：合格

老師批語：

本博文版權(quán)歸博主所有，轉(zhuǎn)載請注明地址！如有侵權(quán)、違法，請聯(lián)系admin@php.cn舉報處理！

全部評論文明上網(wǎng)理性發(fā)言，請遵守新聞評論服務(wù)協(xié)議

0條評論

作者最新博文

Ement常用語法總結(jié)

2021-12-22 16:16:25

亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

今天我們來看一個簡單的table標(biāo)簽實(shí)現(xiàn)的課程表

然后我們看一下，我們最終要呈現(xiàn)的樣子

實(shí)現(xiàn)代碼如下：

然后我們看一下，我們最終要呈現(xiàn)的樣子