使用說明:表格
出自 房屋百科
於 2008年9月2日 (二) 17:31 由 Napole (對話 | 貢獻) 所做的修訂 (新页面: 下面介紹的表格符號必須在'''新的一行的開始'''使用(也有例外),並且可以使用一些在HTML表格標記中可用的參數。 ==表格標記== === Table ===...)
下面介紹的表格符號必須在新的一行的開始使用(也有例外),並且可以使用一些在HTML表格標記中可用的參數。
目錄
表格標記
Table
可以這樣描述一個表格:
{| 參數 |}
相當於
TD
單元格可以這樣產生:
|單元1 |單元2 |單元3
或者這樣也可以:
|單元1||單元2||單元3
相當於
<td>單元1</td><td>單元2</td><td>單元3</td>
其中「||」相當於「新起一行」+「|」
在單元格中可以這樣使用參數:
|參數|單元1
相當於
<td 參數>
TH
使用方法和TD類似,用「!」代替「|」,用「!!」代替「||」。但是參數仍然使用「|」。
TR
<tr> 標記在第一行會自動產生新w. 開始一個新行使用:
|-
或者
|--------------
或者
|-------------------
他們都相當於
<tr>
可以這樣添加參數:
|- 參數
或者
|------- 參數
相當於
<tr 參數>
CAPTION
|+ 標題
相當於
<caption>標題
你也可以使用參數:
|+ 參數|標題
相當於
Caption
實例
簡單的例子
{| border=1 | 單元1,行1 | 單元2,行1 |- | 單元1,行2 | 單元2,行2 |}
將生成:
單元1,行1 | 單元2,行1 |
單元1,行2 | 單元2,行2 |
複雜的例子
注意這個表格將右對齊。
{| align=right border=1 | 單元1, 行1 |rowspan=2| 單元2, 行1 (和2) | 單元3, 行1 |- | 單元1, 行2 | 單元3, 行2 |}
單元1, 行1 | 單元2, 行1 (和2) | 單元3, 行1 |
單元1, 行2 | 單元3, 行2 |
同時使用COLSPAN和ROWSPAN:
{| border="1" cellpadding="5" cellspacing="0" |- ! 欄目一 || 欄目二 || 欄目三 |- | rowspan=2| A | colspan=2 align="left"| B |- | C | D |- | E | colspan=2 align="left"| F |- | rowspan=3| G | H | I |- | J | K |- | colspan=2 align="left"| L |}
將有這樣的效果:
欄目一 | 欄目二 | 欄目三 |
---|---|---|
A | B | |
C | D | |
E | F | |
G | H | I |
J | K | |
L |
嵌套表格
{| border=1 |原有 | {| style="background:blue; color:white" border=2 |插入 |- |表格 |} |表格 |}
生成:
原有 |
|
表格 |
帶標題的表格
{| border=1 align=right |+ '''這是標題''' 請參看: |獨立||1949年 |- |國家||中華人民共和國 |- |時區||UTC+8 |- |國歌||義勇軍進行曲 |- |域名||.cn |} |
|
以上這些條目實際不存在,只是用來說明。
帶顏色的表格
有兩種方法讓表格裡的字和背景出現顏色,下面是第一種:
{| border=1 | bgcolor=blue | <font color=yellow> 字黃背景藍 | 沒設定顏色 | style="background:red; color:yellow" | 字黃背景紅 | 沒設定顏色 |}
生成:
字黃背景藍 | 沒設定顏色 | 字黃背景紅 | 沒設定顏色 |
這種方法能指定單格的顏色和背景。如果要讓一行、一列或一整個表格都是同樣的顏色,則使用第二種方法:
{| style="background:yellow; color:blue" border=1 |- | 這行是 | 藍字 | 黃背景 |- style="background:navy; color:white" | 這行是 | 白字 | 深海藍 |- | 這行 | style="background:white" | 比較 | 不一樣 |}
生成:
這行是 | 藍字 | 黃背景 |
這行是 | 白字 | 深海藍 |
這行 | 比較 | 不一樣 |
像其他參數一樣,顏色參數指定的優先順序為:單格→一行(列)→整個表格。
Help:HTML4.01制定16種顏色名稱,附上16進位值如下所示:
black | #000000 | silver | #c0c0c0 | maroon | #800000 | red | #ff0000 | |||
navy | #000080 | blue | #0000ff | purple | #800080 | fuchsia | #ff00ff | |||
green | #008000 | lime | #00ff00 | olive | #808000 | Yellow | #ffff00 | |||
teal | #008080 | aqua | #00ffff | gray | #808080 | white | #ffffff |
請參見:色彩列表
設定行高與列寬
整個表格的行高(height)和列寬(width),以及任意列的列寬可以進行設定。要設定任意行的行高,可以通過設定該行任意一個單元格的行高來實現。如果存在行、列的高、寬沒有設定,那麼表格的顯示結果可能隨瀏覽器的不同而不同。
{| style="width:75%; height:200px" border="1" |- | abc | def | ghi |- style="height:100px" | jkl | style="width:200px" |mno | pqr |- | stu | vwx | yz |}
將得到這樣的結果:
abc | def | ghi |
jkl | mno | pqr |
stu | vwx | yz |
層疊樣式表
WP內置了CSS,用於格式化表格,可以通過在{|
之後加入class="wikitable"
。例如:
{| class="wikitable" style="text-align:left" |+乘法表 |- ! × !! 1 !! 2 !! 3 |- ! 1 | 1 || 2 || 3 |- ! 2 | 2 || 4 || 6 |- ! 3 | 3 || 6 || 9 |}得到:
× | 1 | 2 | 3 |
---|---|---|---|
1 | 1 | 2 | 3 |
2 | 2 | 4 | 6 |
3 | 3 | 6 | 9 |