web前端开发零基础入门6（关于HTML表格）

疯掉就疯掉吧

已于 2022-07-08 22:50:12 修改

阅读量1.8k

点赞数 3

分类专栏： web前端开发文章标签：前端 html 学习

于 2022-07-07 23:20:59 首次发布

本文链接：https://blog.csdn.net/qq_62512326/article/details/125668846

版权

这篇博客介绍了HTML表格的创建，包括表格的定义、相关标签，如`<table>`、`<tr>`、`<th>`、`<td>`，以及如何设置单元格边框、合并单元格、表格格式、背景色和图片。此外，还讲解了`cellpadding`属性和`frame`、`rules`用于控制边框显示的方法。

摘要由CSDN通过智能技术生成

这两天浅学了一下表格，下面来小小总结一下

一.表格的定义

table 标签定义 HTML 表格。简单的 HTML 表格由 table 元素以及一个或多个 tr、th或 td元素组成表格结构；其中： tr>元素定义表格行，th 元素定义表头，td 元素定义表格单元。
为了让表格更美观，我们会用到：border，colspan，rowspan，align，bgcolor 等来美化表格。

二.表格的标签

之前我们说过在VS里面使用的标签，比如什么meta标签啊。
在下面这个链接里面有我详细说明的：

http://t.csdn.cn/XGKeQ

三.单元格边框(border)

表格边框：在使用table border=“1” /table 的方式来定义，其中：数字表示边框的宽度，单位为像素，下面有一个我写的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
</head>
<body>
    <table border="1" cellspacing="0" align="center">
        <caption><font size="20" color="pink" ><h3 align="center">成绩单</h3></font></caption>
        <tr>
            <th width="100" height="40" bgcolor="aqua" align="center">学号</th>
            <th width="100" height="40" bgcolor="aqua" align="center">姓名</th>
            
            <th width="100" height="20" bgcolor="pink" align="center" conspan="3" >平时成绩 </th>
            
            <th width="100" height="40" bgcolor="aqua" align="center">期末成绩</th>
            
            <th width="100" height="40" bgcolor="aqua" align="center">总成绩</th>
        
        </tr>
        <th width="100" height="40" bgcolor="aqua" align="center">001</th>
        <th width="100" height="40" bgcolor="aqua" align="center">ZZZ</th>
        <th width="100" height="40" bgcolor="aqua" align="center">90</th>
        <th width="100" height="40" bgcolor="aqua" align="center">90</th>
        <th width="100" height="40" bgcolor="aqua" align="center">180