HTML&CSS基礎-表格簡介
作者:尹正傑
版權聲明:原創作品,謝絕轉載!否則將追究法律責任。
一.HTML源代碼
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>表格簡介</title> </head> <body> <!-- 表格在日常生活中使用的非常多,比如Excel就是專門用來創建表格的工具。 表格就是用來表示一些格式化數據的,比如:"課程表","銀行對賬單",在網頁中也可以創建出不同的表格。 --> <!-- 在HTML中,使用table標簽來創建一個表格,表格中有以下幾個常用屬性: border: 等設置為"1"時,表示顯示邊框。 width: 可以為表格設置邊框 align: 當其值為"center"時就可以居中 雖然咱們可以直接在標簽設置樣式,但是官網建議咱們在CSS修改樣式喲~ 溫馨提示: table是一個塊元素 --> <table border="1" width="40%" align="center"> <!-- 在table標簽中使用tr來表示表格中的一行,有幾行就又幾個tr。 --> <tr> <!-- 在tr標簽中需要使用td來創建一個單元格,有幾個單元格就有幾個td rowspan: 橫向合並單元格,數字為幾就合並幾個橫向單元格,默認為1. --> <td>A1</td> <td>A2</td> <td>A3</td> <td rowspan="2">A4</td> </tr> <tr> <td>B1</td> <td>B2</td> <td>B3</td> </tr> <tr> <td>C1</td> <td>C2</td> <td>C3</td> <td>C4</td> </tr> <tr> <!-- 在tr標簽中需要使用td來創建一個單元格,有幾個單元格就有幾個td colspan: 橫向合並單元格,數字為幾就合並幾個橫向單元格,默認為1. --> <td>D1</td> <td>D2</td> <td colspan="2">D3</td> </tr> </table> </body> </html>
二.瀏覽器打開以上代碼渲染結果

