|
論壇說明 | 標記討論區已讀 |
歡迎您來到『史萊姆論壇』 ^___^ 您目前正以訪客的身份瀏覽本論壇,訪客所擁有的權限將受到限制,您可以瀏覽本論壇大部份的版區與文章,但您將無法參與任何討論或是使用私人訊息與其他會員交流。若您希望擁有完整的使用權限,請註冊成為我們的一份子,註冊的程序十分簡單、快速,而且最重要的是--註冊是完全免費的! 請點擊這裡:『註冊成為我們的一份子!』 |
|
主題工具 | 顯示模式 |
2007-05-13, 10:24 AM | #1 (permalink) |
榮譽會員
|
教學 - 表格之設計2
現在我們要說明的是資料格的合併與分割,也就是說一個行下面又分好幾行,或者一個列下面又分好幾個列!這個時候我們要用到的是colspan和rowspan這兩個標籤。
先舉第一個例子,仍然做一個table,caption是史萊姆的第一個家,在列的方面,我們先分成兩大列,一是虎爛集團,一是北極熊營建,而虎爛集團再細分三列,分別是虎爛七子、畫虎爛和菊花茶!至於北極熊營建則分兩列,跑卡丁車和耍酷。所以,第一個th我們要讓屬性多rowspan=3,意思是下面要分成三列!第二個th則是rowspan=2,意思是下面要分成兩列!注意,資料格(也就是td)可以有六種對齊方式!水平對齊可以靠左、靠中和靠右,垂直對齊可以靠上靠中和靠下,也就是用valign=top、middle、bottom等,舉例如下: 現在我們把上表給反過來!先只有一行,也就是標題是史萊姆的第一個家,然後他分成五行!(你可試試如果只分兩行會有何結果?也就是colspan=2),其中三行歸虎爛集團,兩行歸北極熊營建。在此情形下,第一個tr中,th的rowspan=5,第二個tr中,第一個th的colspan=3,第二個th的colspan=2!再來的tr就是填上各個資料!對齊和第一個表格相同,HTML的原始碼如下: 瀏覽器我們把寬縮小,顯示如下: |
__________________ |
|
送花文章: 1110,
|