HTML基礎 table rowspan colspan 跨行與跨列的單元格
阿新 • • 發佈：2020-07-06
OS : Windows 10
browser : Chrome 83.0.4103.116
editor : Visual Studio Code 1.46.1
typesetting : Markdown
html
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <!-- start:demo --> <table border="1"> <tr> <td>00</td> <td>01</td> <td>02</td> <td>03</td> </tr> <tr> <td>10</td> <!-- 這個單元格佔了兩列 --> <!-- 本該由4個td的tr，現在有3個td就可以了 --> <td colspan="2">11,12</td> <td>13</td> </tr> </table> <table border="1"> <tr> <!--有增就有減--> <!--每行的單元格的數量必須相等--> <td rowspan="2">00,10</td> <td>01</td> <td>02</td> <td>03</td> </tr> <tr> <td>11</td> <td>12</td> <td>13</td> </tr> </table> <!-- table align 表格table的對齊方式 width 寬度 ?% 或者 ? height 高度 border 邊框粗細 bordercolor 邊框顏色 bgcolor 背景顏色 background 背景圖片 cellpadding 單元格邊線到內容間的距離(填充距離) cellspacing 單元格與單元格之間的距離(間距) rules 合併單元格邊框線；有可能在IE下不相容 --> <!-- tr bgcolor 行的背景色 align 行中的文字水平居中 height 行的高度 valign 垂直居中 :top middle bottom --> <!-- end:demo --> </body> </html>
result
resource
- [ 教程 ] www.w3school.com.cn/html/index.asp
- [ 手冊 ] www.w3cschool.cn/html5_reference.html
- [ 規範 ] www.runoob.com/html/html5-syntax.html
- [ 平臺 ] www.cnblogs.com
- [ 規範-參考 ] www.w3cschool.cn/wematy
- [ 統計-參考 ] tongji.baidu.com/research/site#browser
感恩曾經幫助過 客名利 的人。
html，xhtml和html5的發展歷史及其特性，建議學習。
程式碼的書寫是有規範的，適當地遵守規範，助人助己。
Chromium和Firefox是開源瀏覽器，新功能眾多，建議關注。
Blink，EdgeHTML，Gecko，KHTML，Trident，WebCore，WebKit等，空閒時可以瞭解一下。
不同的瀏覽器解析程式碼是有差別的，要多關注相容性問題。