领先的免费Web技术教程，涵盖HTML到ASP.NET

网站首页 > 知识剖析 正文

html开发笔记17-从网页中画表格

nixiaole 2024-11-25 15:41:57 知识剖析 18 ℃

一、表格介绍

我们经常从网页上看见这种的表格，这个表格是如何画出来的呢？

二、网页上画表格的原理

1、说明：表格是有行和列的，画表格也不是一个标签，而是多个标签组合使用。

2、画表格步骤：先看图

代码演示：

<body>
<!-- 1、使用 table 标签画出表格的整体范围-->
<!-- 5、在 table 的起始标签里添加 border 给表格画线；"2" 代表表格外框的线粗细-->
<table border="2">
  <!--2、使用 tr 标签画行-->
  <tr>
    <!-- 3、使用 td 标签画单元格，就相当于是 列-->
    <td>张三</td>
  </tr>
</table>
</body>
<body>
<table border="2">
  <tr>
    <td>张三</td>
  </tr>
  
  <tr> <!-- 如果需要多行，可以复制上面的 tr 包括 td 标签-->
    <td>张三</td>
    <td>李四</td>
    <td>王五</td>  <!--如果需要多个列，可以多复制几个 td 标签-->
    <!-- 列的排序方式是：第一行的td标签为第1列，第二行的td为第2列，以此类推-->
  </tr>
</table>
</body>

三、表格位置说明

Tags：

猜你喜欢

最近发表
标签列表