制作商品表格

<!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>
  <body style="text-align: center;">
    <h3>商品表格</h3>
    <table border="1" align="center" >
      <!-- 标题 -->
      <caption></caption>
      <!-- 表头 -->
      <thead>
        <tr>
          <th>分类</th>
          <th>ID</th>
          <th>品名</th>
          <th>单价</th>
          <th>数量</th>
          <th>金额</th>
        </tr>
      </thead>
      <!-- 表体（必选）浏览器自动生成，一个表格中可以有多个tbody -->
      <tbody>
        <!-- 先写tr,创建一个新行（单元格的容器） -->
        <tr>
          <!-- td:单元格，数据存放的地方 -->
          <td rowspan="2">数码</td>
          <td>5018</td>
          <td>电脑</td>
          <td>9000</td>
          <td>2</td>
          <td>18000</td>
        </tr>
        <tr>
            <td>2222</td>
            <td>手机</td>
            <td>3000</td>
            <td>100</td>
            <td>6000</td>
        </tr>
        <tr>
            <td rowspan="2">服装</td>
            <td>1111</td>
            <td>时尚</td>
            <td colspan="2">2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>1112</td>
            <td>牛仔</td>
            <td>10</td>
            <td>1</td>
            <td>100</td>
        </tr>
        <!-- 表尾 -->
        <tfoot>
            <tr>
            <th colspan="5">总金额</th>
            <th>24103</th>
        </tr>
        </tfoot>
      </tbody>
    </table>
    <button>结算</button>
  </body>
</html>

批改老师：

PHPz

批改状态：合格

老师批语：

本博文版权归博主所有，转载请注明地址！如有侵权、违法，请联系admin@php.cn举报处理！

全部评论文明上网理性发言，请遵守新闻评论服务协议

0条评论

作者最新博文

小白安装与配置：chrome，vscode，phpenv

2022-10-14 01:07:35