ASCII码 ASCII码

1. 使用图片,链接,列表,写一个图文列表 2. 使用表格写一个课程表或商品表

发布于：2022-03-18 10:29:55  栏目：技术文档

图文列表

  1.     <ul class="nav" style="display: flex; list-style: none">
  2.         <li class="item">
  3.             <a href="https://www.163.com"><img src="static/images/163.jpg" alt="" /></a>
  4.             <a href="https://www.163.com">图文列表一</a>
  5.         </li>
  6.         &nbsp;&nbsp;
  7.         <li class="item">
  8.             <a href="https://www.qq.com"><img src="static/images/qq.jpg" alt="" /></a>
  9.             <a href="https://www.qq.com">图文列表二</a>
  10.         </li>
  11.         &nbsp;&nbsp;
  12.         <li class="item">
  13.             <a href="https://www.sina.com.cn"><img src="static/images/sina.jpg" alt="" /></a>
  14.             <a href="https://www.sina.com.cn">图文列表三</a>
  15.         </li>
  16.     </ul>

课程表

  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>课程表</title>
  8. </head>
  9. <body>
  10.     <table border="1" width="450" cellspacing="0" cellpadding="5" align="center">
  11.         <caption>
  12.             <h2>课&nbsp;程&nbsp;表</h2>
  13.         </caption>
  14.         <thead bgcolor="#7ecef4">
  15.             <tr>
  16.                 <th>时间</th>
  17.                 <th>周一</th>
  18.                 <th>周二</th>
  19.                 <th>周三</th>
  20.                 <th>周四</th>
  21.                 <th>周五</th>
  22.             </tr>
  23.         </thead>
  24.         <!-- 上午 -->
  25.         <tbody>
  26.             <tr>
  27.                 <td rowspan="4" bgcolor="#80c269">上&nbsp;午</td>
  28.                 <td>PHP</td>
  29.                 <td>PHP</td>
  30.                 <td>PHP</td>
  31.                 <td>PHP</td>
  32.                 <td>PHP</td>
  33.             </tr>
  34.             <tr>
  35.                 <td>HTML5</td>
  36.                 <td>HTML5</td>
  37.                 <td>HTML5</td>
  38.                 <td>HTML5</td>
  39.                 <td>HTML5</td>
  40.             </tr>
  41.             <tr>
  42.                 <td>CSS</td>
  43.                 <td>CSS</td>
  44.                 <td>CSS</td>
  45.                 <td>CSS</td>
  46.                 <td>CSS</td>
  47.             </tr>
  48.             <tr>
  49.                 <td>JS</td>
  50.                 <td>JS</td>
  51.                 <td>JS</td>
  52.                 <td>JS</td>
  53.                 <td>JS</td>
  54.             </tr>
  55.         </tbody>
  56.         <!-- 中午 -->
  57.         <tbody>
  58.             <tr align="center">
  59.                 <td colspan="6" bgcolor="#ff0000">午&nbsp;&nbsp;饭</td>
  60.             </tr>
  61.         </tbody>
  62.         <!-- 下午 -->
  63.         <tbody>
  64.             <tr>
  65.                 <td rowspan="3" bgcolor="#f19ec2">下&nbsp;午</td>
  66.                 <td>PHP</td>
  67.                 <td>HTML5</td>
  68.                 <td>CSS</td>
  69.                 <td>JS</td>
  70.                 <td>框架</td>
  71.             </tr>
  72.             <tr>
  73.                 <td>PHP</td>
  74.                 <td>HTML5</td>
  75.                 <td>CSS</td>
  76.                 <td>JS</td>
  77.                 <td>框架</td>
  78.             </tr>
  79.             <tr>
  80.                 <td>PHP</td>
  81.                 <td>HTML5</td>
  82.                 <td>CSS</td>
  83.                 <td>JS</td>
  84.                 <td>框架</td>
  85.             </tr>
  86.         </tbody>
  87.         <!-- 表尾 -->
  88.         <tfoot align="center" bgcolor="#ffff00">
  89.             <tr>
  90.                 <td>一周计划:</td>
  91.                 <td colspan="5">每天都要写完作业才能睡觉。</td>
  92.             </tr>
  93.         </tfoot>
  94.     </table>
  95. </body>
  96. </html>
相关推荐
阅读 +

© 2020 asciim码

人生就是一场修行