博客列表 >实现图文列表及 课程表

实现图文列表及 课程表

Technology has temperature
Technology has temperature原创
2022年04月18日 21:27:55539浏览

实现图文列表及 课程表

图文列表

代码示范:

  1. <!-- 图文列表 -->
  2. <ul>
  3. <li><img src="https://t7.baidu.com/it/u=1297102096,3476971300&fm=193&f=GIF" alt="" width="100px" height="100px"><a href="">渐变风景1</a></img></li>
  4. <li><img src="https://t7.baidu.com/it/u=91673060,7145840&fm=193&f=GIF" alt="" width="100px" height="100px"><a href="">渐变风景2</a></img></li>
  5. <li><img src="https://t7.baidu.com/it/u=4240641596,3235181048&fm=193&f=GIF" alt="" width="100px" height="100px"><a href="">渐变风景3</a></img></li>
  6. </ul>

效果示范:

图文列表

课程表

代码示范:

  1. <!-- 课程表 -->
  2. <table border="1" style="border-spacing:0">
  3. <caption>course_title</caption>
  4. <tr>
  5. <th>day1</th>
  6. <th>day2</th>
  7. <th>day3</th>
  8. <th>day4</th>
  9. <th>day5</th>
  10. <th>day6</th>
  11. </tr>
  12. <tr>
  13. <td rowspan="4">course1</td>
  14. <td>course2</td>
  15. <td>course3</td>
  16. <td>course4</td>
  17. <td>course5</td>
  18. <td>course6</td>
  19. </tr>
  20. <tr>
  21. <td>course2</td>
  22. <td>course3</td>
  23. <td>course4</td>
  24. <td>course5</td>
  25. <td>course6</td>
  26. </tr>
  27. <tr>
  28. <td>course2</td>
  29. <td>course3</td>
  30. <td>course4</td>
  31. <td>course5</td>
  32. <td>course6</td>
  33. </tr>
  34. <tr>
  35. <td>course2</td>
  36. <td>course3</td>
  37. <td>course4</td>
  38. <td>course5</td>
  39. <td>course6</td>
  40. </tr>
  41. <tr>
  42. <td colspan="6" align="center">course1</td>
  43. </tr>
  44. <tr>
  45. <td rowspan="3">course1</td>
  46. <td>course2</td>
  47. <td>course3</td>
  48. <td>course4</td>
  49. <td>course5</td>
  50. <td>course6</td>
  51. </tr>
  52. <tr>
  53. <td>course2</td>
  54. <td>course3</td>
  55. <td>course4</td>
  56. <td>course5</td>
  57. <td>course6</td>
  58. </tr>
  59. <tr>
  60. <td>course2</td>
  61. <td>course3</td>
  62. <td>course4</td>
  63. <td>course5</td>
  64. <td>course6</td>
  65. </tr>
  66. <tr>
  67. <td>course1</td>
  68. <td colspan="5" align="center">course2</td>
  69. </tr>
  70. </table>

效果示范:

图文列表

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议