CSS统计数据记录数量
生活随笔
收集整理的這篇文章主要介紹了
CSS统计数据记录数量
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
CSS統計數據記錄數量
?
前幾天導師出了個題讓我統計元素的數量。遂寫下分享。
效果
代碼
<!DOCTYPE html> <html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Table</title><link rel="stylesheet" href="../m-css/m-css-1.css"><link rel="stylesheet" href="../m-css/m-css-2.css"><link rel="stylesheet" href="../m-css/m-css-3.css"><style>/*table-base*/table.m-table-count {border-collapse: collapse;}table.m-table-count th,table.m-table-count td {padding: .75rem;}table.m-table-count {counter-reset: section;--d: counter(section);}table.m-table-count tbody tr {counter-increment: section;}table.m-table-count tfoot span:after {content: var(--d)}</style> </head><body><div id="table-1"><table class="m-table-count"><caption>計數表格</caption><thead><th>姓名</th><th>地址</th><th>年齡</th><th>電話</th><th>專業</th><th>時間</th></thead><tbody><tr><td>m-</td><td>成都市高新區</td><td>22</td><td>18488043509</td><td>web前端</td><td>2020</td></tr><tr><td>jan</td><td>成都市高新區</td><td>22</td><td>18488043709</td><td>web前端</td><td>2030</td></tr><tr><td>jan</td><td>成都市高新區</td><td>22</td><td>18488043709</td><td>web前端</td><td>2030</td></tr></tbody><tfoot><tr><td>共<span></span>條數據</td></tr></tfoot></table></div> </body></html>?
總結
以上是生活随笔為你收集整理的CSS统计数据记录数量的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： TweenMax.js大熊猫吃面条动画
- 下一篇： 工作中“偷懒”的窍门？这些技巧请你收下！