首頁 >web前端 >html教學 >HTML table屬性你知道多少,進來了解?

HTML table屬性你知道多少,進來了解?

寻∝梦
寻∝梦原創
2018-08-14 16:22:534090瀏覽

HTML table屬性你知道多少,進來了解一下?在html中表格標籤的使用十分廣泛,對於初學者很好入手,不過也有一些屬性,可以使表格的功能極大提升。應用得當,你會發現它會使頁面變得清晰美觀。讓我們好好學習HTML table屬性吧。

什麼是表格&表格的作用

什麼是表格:由一些被稱為單元格的矩形框按照從左到右從上到下的順序排列到一起組成的

表格的作用:以一定的結構來顯示訊息的。

如何使用table表格

定義表格:f5d188ed2c074f8b944552db028f98a1f16b1740fad44fb09bfe928bcc527e08

建立表格行:a34de1251f0d9fe1e645927f19a896e85194ba175fd9c71e9a9f6e68244d73a8

建立列(單元格):b6c5a531a458a2e790c1fd6421739d1cb90dd5946f0946207856a8a37f441edf 

注意:預設情況下,每行中的列數是統一的。

table表格的特色:

1、獨佔一行

2、寬度自適應(由內容決定) 

table表格屬性:

f5d188ed2c074f8b944552db028f98a1 屬性

  • #width:        設定表格寬度

  • # height:       設置表格高度

  • align:           設置表格在其父元素中的水平對齊方式,取值:left,center,right

  • border:        邊框,邊框寬度,以px為單位的數值,px可省略

  • cellpadding: 儲存格內邊距

  •           格邊框與內容之間的距離

  • cellspacing:  單元特別邊距

  •                    儲存格與表格之間的距離

  • bgcolor:       背景顏色

a34de1251f0d9fe1e645927f19a896e8屬性

  • ##1 .align:          該行的內容對齊方式

  • 2.valign:        此行的內容垂直對齊方式,取值:top,middle,bottom

#家的內容

#3.bgcolor      該行的文字顏色

#b6c5a531a458a2e790c1fd6421739d1c屬性

width

#height

align

valign

##bgcolor

colspan設定單元格跨列

rowspan設定單元格跨行

3、table表格中的其他標記

1.63bd76834ec05ac1f4c0ebbeaafb099437eb775bb5a9e6f3d094e96a76117fe8

   作用:為表格定義標題    位置:表格正上方居中顯示

                              <table>
                 <caption>标题</caption>
                 <tr>
                    <td></td>
                     <td></td>
                 </tr>
               </table>

2.行標題或列標題

    列標題:第一行中的每一列,加粗,水平居中的效果顯示

    行標題:每行裡面的第一列, 加粗,水平居中的效果顯示

    行(列)標題:b4d429308760b6c2d20d6300079ed38e01c3ce868d2b3d9bce8da5c1b7e41e5b    b4d429308760b6c2d20d6300079ed38e01c3ce868d2b3d9bce8da5c1b7e41e5b作用與b6c5a531a458a2e790c1fd6421739d1c90cc1e42bbf9b97c5947038eac7f874e一模一樣

table邊框合併:
屬性:border-collapse

取值:
##    1.separate預設值,分離邊框模式

###     2.collapse邊框合併模式#########table邊框邊距:#########1.作用:設定鄰近單元格邊框之間的距離(類似cellspacing)######2.屬性:border-spacing#######  取值:######       1.取1個值:表示水平和垂直間距相等# #####       2.取2個值:第一個值表示的水平間距######          第二個值表示的垂直間距######           兩個值之間以空格分隔為空格#####3.要求######    border-collapse必須為separate######    必須為分離邊框模式時有效########## 隱藏的顯示效果:### ######    屬性:  visibility:collap:se######     用在表格元素上,刪除一行或一列,不影響表格整個佈局######【相關推薦】##### ####html的基礎元素,讓你零基礎學習HTML###############什麼是HTML檔? HTML檔案的初步認知###################

以上是HTML table屬性你知道多少,進來了解?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn