日本综合一区二区|亚洲中文天堂综合|日韩欧美自拍一区|男女精品天堂一区|欧美自拍第6页亚洲成人精品一区|亚洲黄色天堂一区二区成人|超碰91偷拍第一页|日韩av夜夜嗨中文字幕|久久蜜综合视频官网|精美人妻一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間：8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
創(chuàng)新互聯(lián)HTML教程：HTML表格

HTML 表格

HTML 表格實例

First Name Last Name Points
JillSmith50
EveJackson94
JohnDoe80
AdamJohnson67

在線實例

　表格
　這個例子演示如何在 HTML 文檔中創(chuàng)建表格。

　（可以在本頁底端找到更多實例。）

HTML 表格

　表格由

標(biāo)簽來定義。每個表格均有若干行（由標(biāo)簽定義），每行被分割為若干單元格（由：定義表格的標(biāo)題欄（文字加粗）

…：定義表格的行

：定義表格的列

表格實例

實例

標(biāo)簽定義）。字母 td 指表格數(shù)據(jù)（table data），即數(shù)據(jù)單元格的內(nèi)容。數(shù)據(jù)單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。

　HTML 表格的基本結(jié)構(gòu)：

…
：定義表格

…
…
row 1, cell 1row 1, cell 2
row 2, cell 1row 2, cell 2

嘗試一下 ?

　在瀏覽器顯示如下：

row 1, cell 1row 1, cell 2
row 2, cell 1row 2, cell 2

HTML 表格和邊框?qū)傩?/h2>

　如果不定義邊框?qū)傩?，表格將不顯示邊框。有時這很有用，但是大多數(shù)時候，我們希望顯示邊框。

　使用邊框?qū)傩?code>border來顯示一個帶有邊框的表格：

實例

Row 1, cell 1

Row 1, cell 2

嘗試一下 ?

HTML 表格表頭單元格

　表格的表頭單元格使用標(biāo)簽進(jìn)行定義。

　表格的表頭單元格屬性主要是一些公共屬性，如：align、dir、width、height。

　大多數(shù)瀏覽器會把表頭顯示為粗體居中的文本：

實例

Header 1

Header 2

row 1, cell 1

row 1, cell 2

row 2, cell 1

row 2, cell 2

嘗試一下 ?

　在瀏覽器顯示如下：

Header 1 Header 2
row 1, cell 1row 1, cell 2
row 2, cell 1row 2, cell 2

表格標(biāo)題

　在

標(biāo)簽中我們可以使用

         

... 標(biāo)簽作為標(biāo)題，并在表的頂部顯示出來。

注：此標(biāo)簽在較新版本的HTML / XHTML中已棄用

實例

這是標(biāo)題
row 1, column 1row 1, columnn 2
row 2, column 1row 2, columnn 2

嘗試一下 ?

HTML 表格高度和寬度

　在

標(biāo)簽中您可以使用width（寬）和height（高）屬性設(shè)置表格寬度和高度。您可以按像素或可用屏幕區(qū)域的百分比來指定表格寬度或高度。

實例

Row 1, Column 1Row 1, Column 2
Row 2, Column 1Row 2, Column 2

嘗試一下 ?

HTML 表格背景

　您可以使用以下方法之一設(shè)置 HTML 表格的背景 

  • bgcolor屬性 - 可以為整個表格或僅為一個單元格設(shè)置背景顏色。
  • background屬性 - 可以為整個表設(shè)置背景圖像或僅為一個單元設(shè)置背景圖像。
  • bordercolor屬性 - 可以設(shè)置邊框顏色。

注：HTML5 中不推薦使用bgcolor，background和bordercolor屬性。不要使用這些屬性。 

實例

Column 1

Column 2

Column 3

嘗試一下 ?

　使用background屬性需要提供圖像 URL 地址：

實例

Column 1

Column 2

Column 3

嘗試一下 ?

HTML 表格空間

　有以下兩個屬性，用于調(diào)整 HTML 表格中單元格的空間：

  • cellspacing屬性-定義表格單元格之間的空間 
  • cellpadding屬性-表示單元格邊框與單元格內(nèi)容之間的距離

實例

Name

Salary

其琛

5000

曼迪

7000

嘗試一下 ?

HTML 合并單元格

  • 如果要將兩個或多個列合并為一個列，將使用colspan屬性 
  • 如果要合并兩行或更多行，則將使用rowspan屬性。

實例

Column 1

Column 2

Column 3

Row 1 Cell 1

Row 1 Cell 2

Row 1 Cell 3

Row 2 Cell 2

Row 2 Cell 3

Row 3 Cell 1

嘗試一下 ?

效果如下：

Column 1 Column 2 Column 3
Row 1 Cell 1Row 1 Cell 2Row 1 Cell 3
Row 2 Cell 2Row 2 Cell 3
Row 3 Cell 1

HTML 表格頭部、主體、頁腳

　表格可以分為三個部分 - 頭部，主體和頁腳，如同word 文檔中頁面的頁眉、正文、頁腳。每個頁面保持相同，而正文是表格的主要內(nèi)容持有者。

　頭部，主體和頁腳的對應(yīng)的三個標(biāo)簽是：

  •  - 創(chuàng)建單獨的表頭。
  •  - 表示表格的主體。
  •  - 創(chuàng)建一個單獨的表頁腳。

　表可以包含多個元素以指示不同的頁面。

　但值得注意的是和標(biāo)簽應(yīng)出現(xiàn)在之前：

實例

This is the head of the table

       

This is the foot of the table

     

Cell 1

Cell 2

Cell 3

Cell 4

         

嘗試一下 ?

HTML 表格的嵌套

　您可以在另一個表中使用一個表?？梢允褂?code>

內(nèi)的幾乎所有標(biāo)簽。

實例

NameSalary
其琛5000
曼迪7000

       

嘗試一下 ?

更多實例

　沒有邊框的表格
　本例演示一個沒有邊框的表格。

　表格中的表頭 ( Heading )
　本例演示如何顯示表格表頭。

　帶有標(biāo)題的表格
　本例演示一個帶標(biāo)題  ( caption ) 的表格

　跨行或跨列的表格單元格
　本例演示如何定義跨行或跨列的表格單元格。

　表格內(nèi)的標(biāo)簽
　本例演示如何顯示在不同的元素內(nèi)顯示元素。

　單元格邊距 ( Cell padding )
　本例演示如何使用 Cell padding 來創(chuàng)建單元格內(nèi)容與其邊框之間的空白。

　單元格間距 ( Cell spacing )
　本例演示如何使用 Cell spacing 增加單元格之間的距離。

HTML 表格標(biāo)簽

  • 


    標(biāo)簽
描述

     
    定義表格
     定義表格的表頭
     定義表格的行
     定義表格單元
     
    定義表格標(biāo)題
     
    定義表格列的組
     
    定義用于表格列的屬性
     
    定義表格的頁眉
     
    定義表格的主體
     
    定義表格的頁腳
     
                                                    
    
                                                本文題目：創(chuàng)新互聯(lián)HTML教程：HTML表格                                                
    
                                                文章地址：http://www.dlmjj.cn/article/ccssiis.html