HTML绘制表格效果
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- <table> 标签定义 HTML 表格元素，⼀个 HTML 表格包括 <table> 元素、⼀个或多个 <tr>、<td>、<th> 等元素 -->
<!-- <tr> 元素定义⼀⾏ -->
<!-- <td> 元素定义⼀个单元格 -->
<!-- <th> 元素定义表头 -->
<!-- 每个 <td>、<th> 代表⼀个单元格，如果整个表格中，⼀⾏有3个表格，那么每个表格占 1/3 宽度，
不仅如此，其它⾏的表格也受此影响，也只占它们所在⾏的 1/3，如果它们所在⾏只有它⼀个元素，也是如此，剩余 2/3 将留⽩。
如果其它⾏的⼀个元素想要占满整⾏空间，那就需要⽤到 <colspan> 元素了 -->
<!-- <colspan> 横跨多列 -->
<!-- <rowspan> 横跨多⾏ -->
<table width="100%"border="1">
<tr>
<!-- colspan="5": 横跨 5 列 -->
<th colspan="5">Linux 内核</th>
</tr>
<tr>
<th>Linux 操作系统概述</th>
<th colspan="5">内存管理与内存寻址</th>
html表格元素
</tr>
<tr>
<!-- rowspan="3": 横跨 3 ⾏ -->
<td rowspan="3"></td>
<td colspan="4"align="center">图灵机</td>
</tr>
<tr>
<td width="25%"colspan="2">冯诺依曼结构</td>
<td width="25%"colspan="2">哈佛结构</td>
</tr>
<tr>
<td width="12.5%">Intel X86</td>
<td width="12.5%">AMD</td>
<td width="12.5%">ARM</td>
<td width="12.5%">...</td>
</tr>
<tr></tr>
</table>
</body>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。