td{ width:100pxheight:50px} /*设置单元格宽度100px,高度50px*/
示例如下:
给出HTML元素
<table>
<tr><td>1</td><td>2</td><td>345</td></tr>
<tr><td>6789</td><td>10</td><td>11</td></tr>
</table>
设置单元格高度和宽度样式
table{border-collapse:collapse}
td{
border: 1px solid green/*边框*/
width:100px/*单元格宽度*/
height:50px/*单元格高度*/
text-align:center /*单元格文字居中对齐*/
}
默认情况下,表格的宽度和高度根据内容自动调整,我们也可以手动设置表格的宽度和高度。基本语法
<TABLE
WIDTH=VALUE
HEIGHT=VALUE>
语法解释
通过WIDTH属性定义表格的宽度,HEIGHT属性定义表格的高度,单位是像素或百分比。如果是百分比,则可分为两种情况:如果不是嵌套表格,那么百分比是相对于浏览器窗口而言;如果是嵌套表格,则百分比相对的是嵌套表格所在的单元格宽度。
文件范例:10-3.htm
设定表格的宽度和高度。
01
<!--
------------------------------
-->
02
<!--
文件范例:10-3.htm
-->
03
<!--
文件说明:设定表格的宽度和高度
-->
04
<!--
------------------------------
-->
05
<HTML>
06
<HEAD>
07
<TITLE>设定表格的宽度和高度</TITLE>
08
</HEAD>
09
<BODY>
10
<H1>主流的网页设计软件</H1>
11
<TABLE
BORDER=1
WIDTH=400
HEIGHT=100>
12
<TR>
13
<TD>网页图像软件</TD><TD>Fireworks</TD>
14
</TR>
15
<TR>
16
<TD>网页制作软件</TD><TD>Dreamweaver</TD>
17
</TR>
18
<TR>
19
<TD>网页动画软件</TD><TD>Flash</TD>
20
</TR>
21
</TABLE>
22
</BODY>
23
</HTML>
文件说明
第11行定义了表格的宽度为400像素,高度为100像素。
表格是为了进行页面布局的设计 通过标签属性进行设置 下面是属性介绍table表格
单元格格与单元格之间的间距(外边距) cellspacing
单元格边框与单元格的内容之间的间距 内边距 cellpadding
合并table表格内部边框线
合并table表格内部边框线 border-collapse:collapse(合并)
合并一列中的多行 rowspan
合并一行中的多列 colspan
表格的高度 height
表格的宽度 width
水平对齐方式 align let center right
垂直对齐方式 valid top middle bottom
表格的背景颜色 bgcolor
表格边框的宽度 border