表格屬性
<table>標簽里需要設置的屬性
border:表格的邊框。比如,border=1,表示表格邊框的粗細為1個像素,
為0表示沒有邊框。
cellspacing:單元格間距。當一個表格有多個單元格時,各單元格的距離就是cellspacing,
表格只有一個單元格,這個單元格與表格上、下、左、右邊邊框的距離也是cellspacing。
cellpadding:單元格襯距。指該單元格里的內容與cellspacing區域的距離,
cellspacing為0,表示單元格里的內容與表格周邊邊框的距離。
width:表格的寬度。width的取值還可以使用百分比,如widht="100%"。
height:表格的高度,取值方法同width。
bgcolor:表格的背景色。bgcolor=#ff0000或bgcolor=red。
<td>單元格也可有此屬性。
background:表格的背景圖。<td>也有此屬性。
bordercolor:表格的邊框顏色,當border值不為0時此值有效。取值同bgcolor。
bordercolorlight:亮邊框顏色,當border值不為0時設置此值有效。
亮邊框指表格的左邊和上邊的邊框。
bordercolordark:暗邊框顏色,當border值不為0時設置有效。
暗邊框指表格的右邊和下邊的邊框。
align:表格的對齊方式,值有left(左對齊)、center(居中)以及right(右對齊)。
列1 表格式樣和代碼
本表格的屬性設置:
邊框大小:border=1
邊框顏色:bordercolor=#808000
背景色:bgcolor=#cc9968
表格寬度:width=300
單元格間距:cellspcing=8
單元格襯距:cellpadding=4
表格的對齊方式(居中):align=center
注:其他屬性未設置。
代碼
<TABLE borderColor=#808000 cellSpacing=8 cellPadding=4 width=300 align=center bgColor=#cc9968 border=1>
<TBODY>
<TR>
<TD>
<P>本表格的屬性設置:</P>
<P>邊框大小:border=1 </P>
<P>邊框顏色:bordercolor=#808000 </P>
<P>背景色:bgcolor=#cc9968 </P>
<P>表格寬度:width=300 </P>
<P>單元格間距:cellspcing=8 </P>
<P>單元格襯距:cellpadding=4 </P>
<P>表格的對齊方式(居中):align=center </P>
<P>注:其他屬性未設置。 </P></TD></TR></TBODY></TABLE>
eg.
<html> | |
<head> | |
<style> | |
table | |
{ | |
width:740ox; | |
height:211px; | |
border:solid 1px #d9e4f2; | |
margin-left:auto; | |
margin-right:auto | |
} | |
td | |
{ | |
font-family:宋體; | |
font-size:14px; | |
width:293px; | |
height:34px; | |
text-align:left; | |
padding-left:10px; | |
} | |
th | |
{ | |
font-family:宋體; | |
font-size:14px; | |
font-weight:normal; | |
width:110px; | |
height:34px; | |
text-align:left; | |
padding-left:10px; | |
border:solid 1px #d9e4f2; | |
background-image:url(images/bg2.png); | |
} | |
</style> | |
</head> | |
<body> | |
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse:collapse"> | |
<tr> | |
<th>職位分類</th> | |
<td colspan="3">前端開發工程師</td> | |
</tr> | |
<tr> | |
<th>職位分類</th> | |
<td>上海黃浦</td> | |
<th>工作性質</th> | |
<td>全職</td> | |
</tr> | |
<tr> | |
<th>工作地點</th> | |
<td>3000-5000(元、月)</td> | |
<th>福利待遇</th> | |
<td>無/面談</td> | |
</tr> | |
<tr> | |
<th>工作經驗</th> | |
<td>一年以上</td> | |
<th>年齡要求(歲)</th> | |
<td>20-30</td> | |
</tr> | |
<tr> | |
<th>學歷要求</th> | |
<td>大專(含以上)</td> | |
<th>性別要求</th> | |
<td>不限</td> | |
</tr> | |
<tr> | |
<th>招聘人數</th> | |
<td>5人</td> | |
<th>隸屬部門</th> | |
<td>總部 研發部</td> | |
</tr> | |
</table> | |
</body> | |
</html> |