楼主你好。
html编写表格的方法有多种。
最简单的就是用html标签<table></table>
表格是由表头,表格,表行组成的。
表头<tt></tt>
表行<tr></tr>
表格<td></td>
表头和表格都是放在表行里面的。
下面假设写一个2行1列的表格
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Table</title>
</head>
<body>
<table>
<tr><th>第一行</th></tr>
<tr><td>第二行</td></tr>
</table>
</body>
</html>
用到拆分合并单元格,手写挺麻烦的,先用dw在设计视实现,然后再返回代码视图,复制即可代码如下:
<table width="268" height="200" border="1" cellpadding="0" cellspacing="0"><tr>
<td height="50" colspan="2" bordercolor="#0000FF"> </td>
<td rowspan="4" bordercolor="#0000FF"><table width="100%" height="200" border="1" cellpadding="0" cellspacing="0">
<tr>
<td height="75" bordercolor="#0000FF"> </td>
</tr>
<tr>
<td height="125" bordercolor="#0000FF"> </td>
</tr>
</table></td>
</tr>
<tr>
<td height="50" colspan="2" bordercolor="#0000FF"> </td>
</tr>
<tr>
<td height="50" bordercolor="#0000FF"> </td>
<td height="50" bordercolor="#0000FF"> </td>
</tr>
<tr>
<td height="50" bordercolor="#0000FF"> </td>
<td height="50" bordercolor="#0000FF"> </td>
</tr>
</table>
解释如下:
先插入四行两列的表格,第一列通过合并单元格来实现,第二列将所有单元格合并,然后新插入一个两行一列的表格即可实现上述效果
HTML中,有两种方法可以做到右侧添加表格:
同一个div内,将设置成背景,同时将div内左边距(padding-left)设置成与一样的宽度,再在此div内加表格即可;
做成2个div,同时设置左浮动,第1个div的宽度设置成与一样宽,第2个div宽度根据自己表格情况设定即可,然后再第2个div里添加表格即可
如有问题可再接着问,希望能帮到你!
1、示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
table{
width: 100%;
text-align: center;
line-height: 50px;
}
table tr td{
border-left: 1px solid #00FF00;
}
</style>
</head>
<body>
<div>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>23</td>
</tr>
<tr>
<td>李四</td>
<td>22</td>
</tr>
<tr>
<td>王思</td>
<td>21</td>
</tr>
</table>
</div>
</body>
</html>
2、实例结果
Html的表格用table来表示。下面,我们来看看HTML怎么插入表格吧。
table首先定义HTML表格,代码为<table></table> ,如下图所示:
定义表格的行使用tr元素定义HTML表格的行,如下图所示:
定义单元格使用td元素定义单元格,如下图所示:
表格的边框然后用border定义表格的边框,如下图所示:
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)