html web頁面中table表格的使用方法和介紹


html中table表格的使用
一、表格賞析
      1、[基金網](http://fund.eastmoney.com/dingtou/syph_yndt.html)
       2、[NBA](http://china.nba.com/standings/)
       3、[12306](https://kyfw.12306.cn/otn/leftTicket/init)
二、創建基本表格
在html中創建表格,也是一組標簽,最核心的標簽有如下幾個:

 Table  桌子,表格

 Tr   r row

 Td 單元格 列

 Th 單元格 列通常用於第一行,相當於標題,頭部的意思

 

表格是由行和列組成的一個二維結構,其中的行用tr表示,列用td或th表示。

 

基本用法:

 

三、表格標簽相關屬性
table的相關屬性:

ü  Widht:寬度

ü  Height:高度

ü  Align:對齊方式

ü  Bgcolor:背景顏色

ü  Border:邊框

ü  Cellspaciing:單元格之間的距離

ü  Cellpadding:單元格的內容與單元格邊框的距離

 

Border:表示表格的邊框

 

 


注意:   

1,border是作用於table,但是它對單元格也有影響,讓單元格也產生了邊框。

2,如果把border邊框調整為10的話,這只對最外層的邊框起作用,對里面單元格是不起作用的,始終為1個像素。

 

 

 


3,對於border的屬性值,如果不寫單位,默認單位是px

 

align:表示表格相對於父元素的對齊方式,這原父元素是body

 

 

width和height:表示表格寬度和高度

 

 

 

注意點:

對於width和height的理解:一般理解成min-widht和min-height

 

bgcolor:表示表格背景顏色

 

 

Cellspacing和cellpadding:表示單元格之間的距離,單元格中的內容與單元格的邊框的距離

 

 

Tr屬性:

ü  Height:設置行高

ü  Bgcolor:設置某一行的背景顏色

ü  Align:設置水平對齊方式

ü  Valign:設置重直對齊方式

 

Height:設置行高

 

 

Bgcolor:設置某一行的背景顏色

 

 

Align:設置水平對齊方式

 

 

Valign:設置垂直對齊方式

 

 

注意:

對於align設置時,屬性值有:left   center  right

對於valign設置時,屬性值有:top   middle bottom

 

Td和th的相關屬性:

Rowspan:行合並

Colspan:列合並

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 從html頁面中抽取table表格數據 Bootstrap-table表格插件的使用方法 element ui table表格里面插槽的使用方法 Web開發——HTML基礎(HTML表格 ) html中
標簽的各種屬性介紹_table的使用 linux中wget的使用方法介紹 html5: table表格與頁面布局整理 html中radio使用方法 html中#include file的使用方法 html中#include file的使用方法
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM