查看: 528|回复: 2

[HTML模板] 漂亮的CSS3 表格,非常适合宣传展示数据

[复制链接]
xuanxiao 发表于 2022-6-14 20:32:40 | 显示全部楼层 |阅读模式
微信截图_20220614203014.png

漂亮表格.rar (3.98 KB, 下载次数: 1, 售价: 10 个ASP币)


微信截图_20220614203014.png

绿色漂亮表格.rar (5.64 KB, 下载次数: 1)


 楼主| xuanxiao 发表于 2022-8-6 16:18:55 | 显示全部楼层
第一个,浅灰色表和css样式,非常经典
1.png

  1. <style type="text/css">
  2. table.gridtable {
  3.         font-family: verdana,arial,sans-serif;
  4.         font-size:12px;
  5.         color:#333333;
  6.         border-width: 1px;
  7.         border-color: #666666;
  8.         border-collapse: collapse;
  9. }
  10. table.gridtable th {
  11.         border-width: 1px;
  12.         padding: 8px;
  13.         border-style: solid;
  14.         border-color: #666666;
  15.         background-color: #dedede;
  16. }
  17. table.gridtable td {
  18.         border-width: 1px;
  19.         padding: 8px;
  20.         border-style: solid;
  21.         border-color: #666666;
  22.         background-color: #ffffff;
  23. }
  24. </style>

  25. <table class="gridtable">
  26. <tr>
  27.         <th>汽车</th><th>飞机</th><th>高铁</th>
  28. </tr>
  29. <tr>
  30.         <td>电动车</td><td>波音飞机</td><td>复兴号</td>
  31. </tr>
  32. <tr>
  33.         <td>油电混合</td><td>空客飞机</td><td>和平号</td>
  34. </tr>
  35. </table>
复制代码
 楼主| xuanxiao 发表于 2022-8-6 16:37:36 | 显示全部楼层
1.png

1.html (1.82 KB, 下载次数: 0, 售价: 2 个ASP币)


淡蓝色风格,同时配合了js来实现表格行鼠标悬停高亮的功能
GIF.gif


滑动.html (1.37 KB, 下载次数: 0, 售价: 3 个ASP币)
您需要登录后才可以回帖 登录 | 注册

本版积分规则

快速回复 返回顶部 返回列表

在线客服

售前咨询
售后咨询
服务热线
023-58418553
微信公众号