HTML中的表格元素
來源:易賢網(wǎng) 閱讀:1136 次 日期:2014-08-25 15:04:28
溫馨提示:易賢網(wǎng)小編為您整理了“HTML中的表格元素”,方便廣大網(wǎng)友查閱!

border,width,height,align,cellapcing,cellpasdding.它們都是可選的。

1,border屬性的參數(shù)值是數(shù)字,表示表格邊框?qū)挾人嫉南袼攸c數(shù)。它也可以不帶有參數(shù)值使用,僅表示該表格是有邊框的。例如,<table border=10>表示該表格的邊框?qū)挾葹?0 個像素點。

2,width和height屬性的作用是指定表格的大小。其中width屬性用來規(guī)定表格的寬度,height屬性用以指定表格的高度。這兩個屬性的參數(shù)值可以是數(shù)字或者百分?jǐn)?shù),其中數(shù)字表示表格的寬(高)所占的像素點,百分?jǐn)?shù)表示表格的寬(高)占據(jù)瀏覽器窗口的寬(高)度的百分比。例如:<table width=200 height=50%>表示表格的寬度為200個像素點,高度為瀏覽器窗口高度的50%。

3,align屬性的參數(shù)值為left,center和right之一,分別表示表格位于其相鄰文字的左側(cè)、表格水平居中和表格位于相鄰文字的右側(cè)。例如:

<html>

<head>

<title>測試頁面</title>

</head>

<body>

<table border=3 width=60% align=left>

<TR>

<TH>單元格</TH><TH>單元格</TH>

<TH>單元格</TH><TH>單元格</TH><TH>單元格</TH>

</TR>

<TR>

<TD>1</TD><TD>解釋項</TD>

<TD>解釋項</TD><TD>同上</TD><TD>同上</TD>

</TR>

<TR>

<TD>2</TD><TD>解釋項</TD><TD>同上</TD>

<TD>又一單元</TD><TD>接著來</TD>

</TR>

</table>

文字說明,這個就是表格居于相鄰文字左側(cè)的范例,只要改變一下align的屬性參數(shù)就可以改變表格的位置了。

<HR>

4,cellspacing屬性。cellspacing屬性用來指定表格各單元格之間的空隙。此屬性的參數(shù)值是數(shù)字,表示單元格間隙所占的像素點數(shù)。

5,cellpadding屬性。用來指定單元格內(nèi)容與單元格邊界之間的空白距離的大小。此屬性的參數(shù)值也是數(shù)字,表示單元格內(nèi)容與上下邊界之間空白距離的高度所占像素點數(shù)以及單元格內(nèi)容與左右邊界之間空白距離的寬度所占的像素點數(shù)。例如:

<html>

<head>

<title>測試頁面</title>

</head>

<body>

<HR>

沒加如單元格屬性的規(guī)定之前的樣子:<BR>

<table border=3>

<TR>

<TH>單元格</TH><TH>單元格</TH>

<TH>單元格</TH><TH>單元格</TH><TH>單元格</TH>

</TR>

<TR>

<TD>1</TD><TD>單元格</TD>

<TD>單元格</TD><TD>單元格</TD><TD>單元格</TD></TH>

<TR>

<TD>2</TD><TD>單元格</TD>

<TD>單元格</TD><TD>單元格</TD><TD>單元格</TD></TR>

</table>

<HR>

加入單元格屬性規(guī)定之后的情形:<BR>

<table border=3 cellspacing=10 cellpadding=10>

<TR>

<TH>單元格</TH><TH>單元格</TH>

<TH>單元格</TH><TH>單元格</TH><TH>單元格</TH>

</TR>

<TR>

<TD>1</TD><TD>單元格</TD>

<TD>單元格</TD><TD>單元格</TD><TD>單元格</TD></TH>

<TR>

<TD>2</TD><TD>單元格</TD>

<TD>單元格</TD><TD>單元格</TD><TD>單元格</TD></TR>

</table>

</body>

</html>

接著我們來看看剛剛看到的幾個不熟悉的標(biāo)簽是怎么個意思。

一,<CAPTION>標(biāo)簽。是表格的標(biāo)題的標(biāo)簽。它是成對使用的標(biāo)簽。在首標(biāo)簽和尾標(biāo)簽之間的內(nèi)容就是表個的標(biāo)題。<caption>有兩個屬性:align和valign它們都是可選的。

其中,align屬性的參數(shù)值為left,center,right之一,分別表示表格標(biāo)題與表格的左邊沿兒對齊,位于表格中間和表格的右邊沿兒對齊。缺省時,表格標(biāo)題位于表格的中間;valign屬性的參數(shù)值是top和bottom之一,分別表示表格標(biāo)題位于表格的上方和下方,缺省時,表格的標(biāo)題位于表格的上方。例如:

<html>

<head>

<title>測試頁面</title>

<body>

<HR>

<table border=3>

<caption align=right><b>這就是該表格的標(biāo)題</b></caption><BR>

<TR>

<TH>單元格</TH><TH>單元格</TH>

<TH>單元格</TH><TH>單元格</TH><TH>單元格</TH>

</TR>

<TR>

<TD>1</TD><TD>單元格</TD>

<TD>單元格</TD><TD>單元格</TD><TD>單元格</TD></TH>

<TR>

<TD>2</TD><TD>單元格</TD>

<TD>單元格</TD><TD>單元格</TD><TD>單元格</TD></TR>

</table>

<HR>

</body>

</html>

這個例子中的表格標(biāo)題是與表格的右邊沿兒對齊的。

二,<TR>標(biāo)簽。是行標(biāo)簽。HTML的表格是按行組織的。一個表格由幾行組成,就要有幾個標(biāo)簽與之對應(yīng)。行標(biāo)簽<TR>是成對使用的標(biāo)簽。它必須和<TH><TD>標(biāo)簽配合使用,后者在使用時嵌套在<TR>和</TR>之間,用來規(guī)定該行中各單元格的內(nèi)容。<TR>標(biāo)簽有兩個屬性。即align和valign屬性,他們都是可選的。

其中align屬性的參數(shù)值為left,center和right之一(以后如我特別說明,該屬性的參數(shù)都是這三個)分別表示個行中各單元格內(nèi)容是左對齊、水平居中和右對齊的。缺省時為left(居左);valign屬性的參數(shù)值是top,middle和bottom之一,分別表示該行中各單元格內(nèi)容是緊靠上沿兒,垂直居中和緊靠下沿兒的。缺省時為middle(居中)。

三,<TH>和<TD>標(biāo)簽

<TH>和<TD>標(biāo)簽都是用來規(guī)定單元格內(nèi)容的,表頭標(biāo)簽<TH>用來規(guī)定表頭元素的內(nèi)容,表頭元素一般位于每列的首行,用來說明該列的具體數(shù)據(jù)是關(guān)于哪個對象的。<TH>標(biāo)簽是成對的。數(shù)據(jù)標(biāo)簽<TD>也是成對使用的,首標(biāo)簽和尾標(biāo)簽之間的內(nèi)容就是該單元格的具體數(shù)據(jù)(也就是對表頭的解釋內(nèi)容)由于兩者都是用于規(guī)定單元內(nèi)容的,<TH>和<TD>標(biāo)簽的所有屬性及相應(yīng)的屬性功能是完全一樣的。<TH><TD>標(biāo)簽的屬性有rowspancolspanalignvalign。

(1)rowspan屬性的參數(shù)值是數(shù)字,表示該單元格所跨的行數(shù)。缺省值為1。

(2)colspan屬性的參數(shù)值也是數(shù)字,表示該單元格所跨的列數(shù)。缺省值為1。

(3)align屬性用于規(guī)定單元格內(nèi)容在水平方向上的位置。三個參數(shù)值分別表示該單元格是左對齊,居中還是右對齊。缺省時為left(左對齊)

(4)valign屬性用于規(guī)定單元格內(nèi)容在垂直方向上的位置。屬性的參數(shù)值為top,,middle和bottom之一,分別表示該單元格內(nèi)容是緊靠上沿兒,垂直居中還是緊靠下沿兒。缺省時為middle(垂直居中)。

好了,今天差不多就到這兒吧!太多了看不過來,不容易記憶。

更多信息請查看IT技術(shù)專欄

更多信息請查看網(wǎng)頁制作
上一篇:Css顏色漸變
易賢網(wǎng)手機網(wǎng)站地址:HTML中的表格元素
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢回復(fù)僅供參考,敬請考生以權(quán)威部門公布的正式信息和咨詢?yōu)闇?zhǔn)!

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號
云南網(wǎng)警備案專用圖標(biāo)
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關(guān)注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)
云南網(wǎng)警報警專用圖標(biāo)