饥人谷Wiki

====== 差别 ======

这里会显示出您选择的修订版和当前版本之间的差别。

--- 前端基础_html_table.md [2021/09/15 14:29]
admin 创建
+++ 前端基础_html_table.md [2021/09/15 14:40]
admin
@@ 行 2: / 行 2: @@
 [\<\< 返回HTML教程](:document/html)
+# 表格 Table
+## 简单表格
+```html
+<table>
+  <thead>
+    <tr>
+      <th>球员</th>
+      <th>号码</th>
+      <th>身高</th>
+      <th>体重</th>
+      <th>生日</th>
+      <th>国籍</th>
+      <th>出生地</th>
+    <tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>勒布朗·詹姆斯</td>
+      <td>23</td>
+      <td>2.03米/6英尺8英寸</td>
+      <td>113.4公斤</td>
+      <td>1984年12月30日</td>
+      <td colspan="2">美国</td>
+    </tr>
+    <tr>
+      <td>凯里·欧文</td>
+      <td>2</td>
+      <td>1.91米/6英尺3英寸</td>
+      <td>88公斤/193磅</td>
+      <td>1992年3月23日</td>
+      <td>美国/澳洲</td>
+      <td>澳洲</td>
+    </tr>
+    <tr>
+      <td>凯文·乐福</td>
+      <td>0</td>
+      <td>2.08米/6英尺10英寸</td>
+      <td>110公斤/243磅</td>
+      <td>1988年9月7日</td>
+      <td colspan="2">美国</td>
+    </tr>
+  </tbody>
+</table>
+```
+## 9x9 乘法表
+<table>
+  <thead>
+    <tr>
+      <th>&times;</th>
+      <th>1</th>
+      <th>2</th>
+      <th>3</th>
+      <th>4</th>
+      <th>5</th>
+      <th>6</th>
+      <th>7</th>
+      <th>8</th>
+      <th>9</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <th>1</th>
+      <td>1</td>
+      <td>2</td>
+      <td>3</td>
+      <td>4</td>
+      <td>5</td>
+      <td>6</td>
+      <td>7</td>
+      <td>8</td>
+      <td>9</td>
+    </tr>
+    <tr>
+      <th>2</th>
+      <td>2</td>
+      <td>4</td>
+      <td>6</td>
+      <td>8</td>
+      <td>10</td>
+      <td>12</td>
+      <td>14</td>
+      <td>16</td>
+      <td>18</td>
+    </tr>
+    <tr>
+      <th>3</th>
+      <td>3</td>
+      <td>6</td>
+      <td>9</td>
+      <td>12</td>
+      <td>15</td>
+      <td>18</td>
+      <td>21</td>
+      <td>24</td>
+      <td>27</td>
+    </tr>
+    <tr>
+      <th>4</th>
+      <td>4</td>
+      <td>8</td>
+      <td>12</td>
+      <td>16</td>
+      <td>20</td>
+      <td>24</td>
+      <td>28</td>
+      <td>32</td>
+      <td>26</td>
+    </tr>
+    <tr>
+      <th>5</th>
+      <td>5</td>
+      <td>10</td>
+      <td>15</td>
+      <td>20</td>
+      <td>25</td>
+      <td>30</td>
+      <td>35</td>
+      <td>40</td>
+      <td>45</td>
+    </tr>
+    <tr>
+      <th>6</th>
+      <td>6</td>
+      <td>12</td>
+      <td>18</td>
+      <td>24</td>
+      <td>30</td>
+      <td>36</td>
+      <td>42</td>
+      <td>48</td>
+      <td>54</td>
+    </tr>
+    <tr>
+      <th>7</th>
+      <td>7</td>
+      <td>14</td>
+      <td>21</td>
+      <td>28</td>
+      <td>35</td>
+      <td>42</td>
+      <td>49</td>
+      <td>56</td>
+      <td>63</td>
+    </tr>
+    <tr>
+      <th>8</th>
+      <td>8</td>
+      <td>16</td>
+      <td>24</td>
+      <td>32</td>
+      <td>40</td>
+      <td>48</td>
+      <td>56</td>
+      <td>64</td>
+      <td>72</td>
+    </tr>
+    <tr>
+      <th>9</th>
+      <td>9</td>
+      <td>18</td>
+      <td>27</td>
+      <td>36</td>
+      <td>45</td>
+      <td>54</td>
+      <td>63</td>
+      <td>72</td>
+      <td>81</td>
+    </tr>
+  </tbody>
+</table>
+## 加点样式
+```
+table {
+  border-collapse: collapse;
+}
+th, td {
+  border: 1px solid green;
+}
+```
+## 参考链接
+* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table
+* https://developer.mozilla.org/en-US/docs/Learn/HTML/Tables/Basics
+* https://developer.mozilla.org/en-US/docs/Learn/HTML/Tables/Advanced
 </markdown>

饥人谷Wiki

站点工具

用户工具

页面工具