我们经常使用HTML绘制表格，那么如何绘制呢？下面我给大家分享一下。
工具/材料Sublime Text
首先打开Sublime Text软件，新建一个HTML文档，并添加HTML结构，如下图所示
接下来我们加入表格标签table，然后在table里面添加tr和td，如下图所示
运行页面以后我们就可以看到如下图所示的表格了
最后我们还可以给表格添加表头，如下图所示
定义和用法
table的align 属性规定表格相对于周围元素的对齐方式。
通常来说，HTML 表格的前后都会出现折行。通过运用 align 属性，可实现其他 HTML 元素围绕表格的效果。
语法如下：
<table align="value">value取值为：
left 左对齐表格。
right 右对齐表格。
center 居中对齐表格。
例如，想要实现表格在周围元素的右边，实现代码如下
<table border="1" align="right">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
<p>align 属性可以使文本围绕在表格周围。</p>
<p>在 HTML 401 中，不赞成使用 body 元素的 align 属性；在 XHTML 10 Strict DTD 中，不支持 body 元素的 align 属性。</p>
运行后效果如图：
表格位于文字的右边显示
注意：在 HTML 401 中，不赞成使用 body 元素的 align 属性；在 XHTML 10 Strict DTD 中，不支持 body 元素的 align 属性。
请使用 CSS 代替。
CSS 语法：
<table style="float:right">
align 属性规定表格相对于周围元素的对齐方式。
通常来说，HTML 表格的前后都会出现折行。通过运用 align 属性，可实现其他 HTML 元素围绕表格的效果。
不要用align，建议css控制样式
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 401 Transitional//EN"
"http://wwww3org/TR/html4/loosedtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<table width="862" border="1">
<tr>
<td align="center"> </td>
<td> </td>
</tr>
<tr>
<td align="center">姓名：</td>
<td> </td>
</tr>
<tr>
<td align="center">密码：</td>
<td> </td>
</tr>
<tr>
<td align="center">性别：</td>
<td> </td>
</tr>
<tr>
<td width="110" align="center">爱好：</td>
<td width="736"> </td>
</tr>
<tr>
<td align="center">职业： </td>
<td> </td>
</tr>
<tr>
<td align="center">简介：</td>
<td> </td>
</tr>
<tr>
<td align="center">提交：</td>
<td> </td>
</tr>
</table>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）