html做个表格的步骤如下：
1、首先新建一个html，点击<body></body>中间，先填入表格内容；
2、内容根据需求来写即可，示例代码如下：
<table>
<p style="text-align:center ">功课表</p>
<tr>
<th>语文</th>
<td>7:00-7:40</td>
<td>7:50-8:30</td>
</tr>
<tr>
<th>数学</th>
<td>7:00-7:40</td>
<td>7:50-8:30</td>
</tr>
<tr>
<th>英文</th>
<td>7:00-7:40</td>
<td>7:50-8:30</td>
</tr>
</table>
3、然后在<head></head>中间输入样式表的样式；
4、样式也根据个人的需求来设置即可，设置单元格的宽度高度，合并单元格，位置，颜色等等，示例代码如下：
<style type="text/css">
body
{
width:340px
height :800px
}
table
{
border-collapse :collapse
}
th,td
{
width:100px
height:40px
border :1px solid black
font-size:12px
text-align :center
}
</style>
5、这里需要注意这个代码“table”的意义是将表格边框合并为单一的边框，将相邻变合并。
6、预览结果如下所示，一个简单的表格就制作出来了。
<table width="800" border="0" align="center" cellpadding="0"cellspacing="0">该标记标示表格的开始，该表格宽度为800像素，边框粗细为0( 即不显示边框 )，对齐方式"水平居中"，单元格边距"0"，单元格间距"0"。表格属性的设置及相关说明：border: 用于设置表格边框的粗细，属性值为数值，数值越大，框线越粗，如果设置border="0"，则表示不显示表格框线background: 用于设置表格的背景图片，属性值为URL( 图片所在路径及图片文件的文件名 )例：<table background="URL"> <!--设置表格背景图片-->cellspacing: 用于设置表格内框线宽度( 即单元格间距 )，属性值为数值( 单位为像素 )，数值越大，单元格间距越大，若未设置，默认值为2例：<table cellspacing="1"> <!--设置表格中单元格间距为1-->cellpadding: 用于设置表格内文字与表格框线之间的间距( 单元格边距 )，属性值为数值( 单位为像素 )，数值越大，表格内文字与表格框线的间距越大，该属性的设置值必须是大于或等于0的正整数值，若未设置，默认值为1例：<table cellpadding="0"> <!--设置表格中单元格边距为0-->width: 用于设置表格的宽度( 也可用于设置单元格<td>或<th>宽度 )，属性值可以是数值( 单位为像素 )，也可以是百分比( 相对于父级目标的比例值 )，数值越大，表示宽度越大( 注: 设置width属性时，可以先设置表格的宽度，再依次设置各单元格的宽度，也可以不设置表格的宽度，仅设置表格中各单元格的宽度 )例：<table width="100"> <!--设置表格宽度为100像素--><td width="20%"> <!--设置单元格宽度为所在表格宽度的20%-->height: 用于设置表格的高度( 也可用于设置单元格<td>或<th>高度 )，属性值可以是数值( 单位为像素 )，也可以是百分比( 相对于父级目标的比例值 )，数值越大，表示高度越大( 注: 设置height属性时，可以先设置表格的高度，再依次设置各单元格的高度，也可以不设置表格的宽度，仅设置表格中各单元格的高度 )例：<td height="30"> <!--设置单元格高度为30像素-->bgcolor: 用于设置表格或单元格或表格中的行或列的背景颜色，属性值可以使用颜色名称，或使用三原色混色值例：<table bgcolor="blue"><!--设置表格背景颜色为蓝色--><td bgcolor="black"> <!--设置单元格背景颜色为黑色-->align: 用于设置表格或单元格的对齐方式。在<table>标记中设置align属性用于设置表格的对齐方式，包括: center( 表格居中对齐 )，left( 表格左对齐，默认值 )，right( 表格右对齐 )。在行<tr>或单元格<td>或<th>标记中设置align属性用于设置单元格内文字的对齐方式，包括: center( 单元格内文字居中对齐 )，left( 单元格内文字左对齐，默认值 )，right( 单元格内文字右对齐 )valign: 用于设置单元格内文字垂直对齐方式，包括: top( 单元格内文字顶端对齐 )，middle( 单元格内文字垂直居中对齐，默认值 )，bottom( 单元格内文字底端对齐 ) <tr>表格中的行标记，tr即table row的缩写，<tr>标记为成对标记，用于设置表格中一行的开始和结束及该行的相关属性，表格中有多少行，则该表格的<table>…</table>标记内就有多少对<tr>…</tr>标记与之对应。例：<tr valign="top">该标记标示行的开始，垂直对齐方式"顶端对齐"( 默认为垂直居中对齐 )。<tr>标记中的水平对齐属性：align="left"( 左对齐 )align="center"( 居中 )align="right"( 右对齐 )。<tr>标记中的垂直对齐属性：valign="top"( 顶端 )valign="middle"( 居中 )valign="bottom"( 靠下 )。 <td>表格中的字段( 列 )数据标记，td即table Data的缩写，<td>标记为成对标记，用于设置字段数据的开始和结束及字段的相关属性，表格中有多少列，则该表格的<table>…</table>标记内就有多少对<td>…</td>标记与之对应。例：<td width="50%">该标记标示一个单元格的开始，该单元格宽度设置为父级目标宽度的50%。<th>表格中列标题( 字段名 )定义标记，th是Table Header的缩写，<th>标记为成对标记，用于设置表格的表头名称( 字段名 )，该标记内文字的对齐方式为水平居中且垂直居中，字体加粗。也可以在该标记内使用align和valign设置该字段内的对齐方式，其设置值的有效范围只限于该数据。在<tr>标记内，align和valign对该行中的所有字段均有效。<border><table>标记中的属性之一，用于设置表格边框的粗细。Border属性值可用数值表示，其值为0或省略此项设置表示不显示边框，数值越大表示框线越粗。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）