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

寻∝梦
發布: 2018-08-14 16:22:53
原創
4071 人瀏覽過

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

什麼是表格&表格的作用

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

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

如何使用table表格

定義表格:

建立表格行:< /tr>

建立列(單元格): 

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

table表格的特色:

1、獨佔一行

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

table表格屬性:

屬性

  • #width:        設定表格寬度

  • # height:       設置表格高度

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

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

  • cellpadding: 儲存格內邊距

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

  • cellspacing:  單元特別邊距

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

  • bgcolor:       背景顏色

屬性

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

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

#家的內容

#3.bgcolor      該行的文字顏色

#

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

                              <table>
                 <caption>标题</caption>
                 <tr>
                    <td></td>
                     <td></td>
                 </tr>
               </table>
登入後複製

2.行標題或列標題

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

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

    行(列)標題:

    作用與
屬性

width

#height

align

valign

##bgcolor

colspan設定單元格跨列

rowspan設定單元格跨行

3、table表格中的其他標記

1.

一模一樣

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中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板