简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Home
Article
Q&A
Course
Topic
Download
Game
Dictionary
Recent Updates

博客列表 >案例表格的应用

案例表格的应用

酒馆读书人.
酒馆读书人.原创
2021年07月01日 23:20:00398浏览
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  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>Document</title>
  8.     <style>
  9.         table tr{text-align: center;}
  10.     </style>
  11. </head>
  12. <body>
  13.     <table border="1"  width="80%">
  14.         <caption>商品信息表</caption>
  15.         <thead>
  16.          <tr bgcolor="lightblue">
  17.             <th>id</th>
  18.             <th>类别</th>
  19.             <th>商品名</th>
  20.             <th>金额</th>
  21.             <th>数量</th>
  22.          </tr>
  23.         </thead>
  24.        <tbody>
  25.           <tr>
  26.             <td>1</td>
  27.             <td rowspan="2">前端</td>
  28.             <td>js</td>
  29.             <td>20</td>
  30.             <td>1</td>
  31.         </tr>
  32.         <tr>
  33.             <td>2</td>
  34.             <td>jquery</td>
  35.             <td>100</td>
  36.             <td>1</td>
  37.         </tr>
  38.         <tr>
  39.             <td>3</td>
  40.             <td rowspan="2">后端</td>
  41.             <td>php</td>
  42.             <td>100</td>
  43.             <td rowspan="2">50</td>
  44.         </tr>
  45.         <tr>
  46.             <td>4</td>
  47.             <td>mysql</td>
  48.             <td>100</td>
  49.         </tr>  
  50.     </tbody>
  51.     <tfoot>
  52.         <tr bgcolor="yellow">
  53.             <td colspan="3">合计</td>
  54.             <td>320</td>
  55.             <td>52</td>
  56.         </tr>  
  57.     </tfoot>
  59.     </table>
  60. </body>
  61. </html>
上一条：php学习第四天下一条：前端作业-CSS1
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多