HTML Table 表格 - Wibibi
文章推薦指數: 80 %
HTML 網頁設計不可或缺的元素就是表格(Table),通常表格用來做版面的排版,而表格 ... 請注意HTML 語法都必須用一個開始標籤與一個結束標籤把內容包起來,開始標籤與 ...
首頁
HTML
HTML5
PHP
MySQL
CSS
CSS3
JavaScript
軟體介紹
其它
Home › HTML › HTMLTable表格
HTMLTable表格
HTML網頁設計不可或缺的元素就是表格(Table),通常表格用來做版面的排版,而表格的用法包含了幾個重要的標籤,分別是table、tr與td這幾個重點,組合起來才是個完整的表格,以下做個簡單的表格範例。 呈現結果如下這裡可以放表格內容範例中使用了這裡可以放表格內容 與
的標籤把內容包起來,標籤代表的是一行,而 標籤則代表一列,為了清楚呈現,我們還為table加上了border="1"的設定,這代表這個table的邊框粗細是1,在實際使用上你也可以設定為其它的値,例如border="0"則不會顯示邊框。
請注意HTML語法都必須用一個開始標籤與一個結束標籤把內容包起來,開始標籤與結束標籤是對等的,缺一不可。
除了可以寫一個單純的表格之外,我們還可以設定table的寬度、高度或邊框樣式,要做這些設定,你必須先了解幾個能夠控制表格的元素,例如width、border、background...等。
width:控制table的寬度border:控制table邊框的粗細background:控制背景圖片colspan:控制儲存格橫跨幾個欄位rowspan:控制儲存格垂直跨幾個欄位接著我們寫幾個範例兩個欄位的table表格範例 呈現結果如下這裡是第一個欄位這裡是第二個欄位兩行兩欄位的Table表格範例這裡是第一個欄位 這裡是第二個欄位 這裡是第一行的第一個欄位 這裡是第一行的第二個欄位 呈現結果如下這裡是第一行的第一個欄位這裡是第一行的第二個欄位這裡是第二行的第一個欄位這裡是第二行的第二個欄位接著我們把第一行變成一個欄位這裡是第二行的第一個欄位 這裡是第二行的第二個欄位 呈現結果如下這裡是第一行這裡是第二行的第一個欄位這裡是第二行的第二個欄位最後做一個兩欄位的Table,第一個欄位rowspan="2",第二個欄位有兩行這裡是第二行的第一個欄位 這裡是第二行的第二個欄位 這裡是第二個欄位第一行 呈現結果這是第一個欄位這裡是第二個欄位第一行這裡是第二個欄位第二行延伸閱讀HTML水平置中與垂直置中HTMLTable表格文字顏色HTMLTable表格的文字大小與字型HTML背景顏色bgcolor與背景圖片background設定CSSborder邊框HTMLTable表格邊框顏色與樣式設計HTMLTable表格背景顏色HTMLTablecellpadding屬性
您可能會想看
HTMLdiv標籤
設計HTML圖片與圖片邊框間的距離
DIV區塊內文字與邊框的距離調整
HTMLTABLE表格內的文字行高
DIV區塊內的文字行高設計
替HTMLbutton按鈕增加背景圖片
HTMLimgtitle與imgalt的差別
用CSS設計HTML表格欄位內文字靠下對齊
用CSS設計HTML表格欄位內文字靠上對齊
HTMLTablecolspan屬性
今日熱門文章
MySQLSELECTWHEREdate等於上個月的條件判斷寫法
MySQLSELECTWHEREdate等於本月的條件判斷寫法
MySQLSELECTWHEREdate等於昨天的條件判斷寫法
PHPmysqli_set_charset函式設定字符編碼
PHP:mysqli_connect資料庫連線函式
MySQLSELECT判斷今天之前或某天之前的日期條件判斷寫法
MySQLSELECTWHEREdate等於今天的條件判斷寫法
HTMLdiv標籤
CSSAttributeSelectors屬性選擇器
替CSSspan區域增加陰影效果
即時熱門文章
MySQLSELECTWHEREdate等於上個月的條件判斷寫法
MySQLSELECTWHEREdate等於本月的條件判斷寫法
MySQLSELECTWHEREdate等於昨天的條件判斷寫法
PHPmysqli_set_charset函式設定字符編碼
PHP:mysqli_connect資料庫連線函式
MySQLSELECT判斷今天之前或某天之前的日期條件判斷寫法
MySQLSELECTWHEREdate等於今天的條件判斷寫法
HTMLdiv標籤
CSSAttributeSelectors屬性選擇器
替CSSspan區域增加陰影效果
©Copyrightwibibi.com網頁設計教學百科基礎的網頁設計規劃、資料庫與程式設計Since2012
這裡是第二個欄位第二行
延伸文章資訊
- 1表格運用教學
妳可以傻傻的用我的測試語法網頁去測試一次沒關西哈哈! 【 大表格包數個小表格 】: 現在簡單的表格應該已經會做了吧!接下來 ...
- 2<table>(表格元素) - HTML:超文本標記語言 - MDN Web Docs
HTML 元件代表表格數據──換句話說,就是透過二維資料表來呈現資訊。
- 3HTML 語法:TABLE(表格) - 隨意窩
HTML 語法:TABLE(表格) ; width height, % 或px 值, 表格寛、高 ; border, 數值, 外框粗細 ; bordercolor, 色碼, 外框顏色 ; cel...
- 4HTML <table> 表格- HTML 語法教學Tutorial - Fooish 程式技術
HTML <table> 標籤(tag) 用來建立表格,也就是用來呈現二維的資料表資訊。 <table> 標籤做為表格的容器(container),裡面有不同用途的標籤像是<tr>, ...
- 5HTML Table 表格 - Wibibi
HTML 網頁設計不可或缺的元素就是表格(Table),通常表格用來做版面的排版,而表格 ... 請注意HTML 語法都必須用一個開始標籤與一個結束標籤把內容包起來,開始標籤與 ...