html表格

表格由 <table> 标签来定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

 

表头的写法:

<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>

 

定义表格

<table>

详细划分表格可以划分为三部分:

<table> 表格的定义 表格分为三部分:1.<thead>承载表格的 表头  2.<tbody>承载表格的内容,其内容用th  3.<tfoot>定义表格的页脚,比如一些备注的东西

但是表格的内容也可以简化,自己div去做表格,不过table有了很多的规范样式

 

补充:col标签控制表格的列,表示列,具体属性可以查看w3cschool,控制每一个tr元素下的相同位置的td元素,<col> 标签很有用,这样就不需要对各个单元和各行重复应用样式了。只能在 table 或 colgroup 元素中使用 <col> 标签。可以通过class属性去改变样式,通过属性去设定相应的值

colgroup:这个标签是对列的分组,出现多个列时候先对列进行组别的划分,然后在colgroup嵌套col对该colgroup组中的列进行详细的设定。列子如下:

复制代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>html 中< col>标签和< colgroup>标签的区别</title>
</head>
<body style="font-size:28px;">
<table width="450" border="1">
<colgroup style="background:red">
</colgroup>
<colgroup span="2" style="background:black">
<col style="background:yellow">
<col style="background:red">
</colgroup>
<tr><th>学号</th><th>姓名</th><th>成绩</th></tr>
<tr><td>01</td><td>张三</td><td>50</td></tr>
<tr><td>02</td><td>李四</td><td>90</td></tr>
</table>
</body>
</html>
复制代码

 

posted @   Ace-GJH  阅读(168)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示
主题色彩