HTML学习08－_TABLE标签 表格标签

最新推荐文章于 2021-11-03 23:44:35 发布
最新推荐文章于 2021-11-03 23:44:35 发布
阅读量477 收藏
点赞数
分类专栏： HTML5 基础教程学习笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Leemin_ios/article/details/52059035
版权

_TABLE标签 表格标签

每一个表格由 table 标签开始。

每一个表格行由 tr 标签开始。

每一个表格数据由 td 标签开始。

<tr></tr>：一排。<td>100</td>：数据。border ：表格边框。

<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>图像标签</title>
</head>
<body>
<p>每一个表格由 table 标签开始。</p>
<p>每一个表格行由 tr 标签开始。</p>
<p>每一个表格数据由 td 标签开始。</p>
<h4>一列：</h4>
<!-- 边缘10-->
<table border="10">
    <tr>
        <td>100</td>
    </tr>
</table>
<h4>一行三列：</h4>
<table border="3">
    <tr>
        <td>100</td>
        <td>200</td>
        <td>300</td>
    </tr>
</table>
<h4>两行三列：</h4>
<table border="1">
    <tr>
        <td>100</td>
        <td>200</td>
        <td>300</td>
    </tr>
    <tr>
        <td>400</td>
        <td>500</td>
        <td>600</td>
    </tr>
</table>
</body>
</html>
效果：


表格

表格由<table>标签来定义。每个表格均有若干行(由<tr>标签定义)，每行被分割为若干单元格（由<td>标签定义）。

字母td指表格数据（table data），即数据单元格的内容。

数据单元格可以包含文本、图片、列表、标签、表情、水平线、表格等等。

表格的表头

表格的表头使用 <th> 标签进行定义。

大多数浏览器会把表头显示为楷体居中的文字。

<table border="1">
    <tr>
        <th>Reading</th>
        <th>Another Reading</th>
    </tr>
    <tr>
        <td>row 1 , cell 1</td>
        <td>row 1 , cell 2</td>
    </tr>
    <tr>
        <td>row 2 , cell 1</td>
        <td>row 2 , cell 2</td>
    </tr>
</table>
在浏览器中显示如下：

表格中的空单元格

在一些浏览器中，没有内容的单元格显示的不太好。如果某个单元格是空的（没有内容），浏览器可能无法显示出这个单元格的边框。

&nbsp;    相当于一个空格键。

也可以插入图片、链接

<table border="1">
    <tr>
        <th>Reading</th>
        <th>Another Reading</th>
    </tr>
    <tr>
        <td> </td>
        <td><a href="http://www.baidu.com"><img src="2.gif"></a></td>
    </tr>
    <tr>
        <td>row 2 , cell 1</td>
        <td>row 2 , cell 2</td>
    </tr>
</table>

在浏览器效果展示：



Leemin_ios
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
table（表格）
softlipaaa的博客
07-09 1万+
table（表格）介绍合并单元格colspan（横向合并单元格）rowspan（纵向合并单元格）长表格表格的样式border-spacing（指定边框之间的距离）border-collapse（设置边框的合并）注 介绍 1、table（表格）可以表示一些格式化数据，例如课程表、人名单、成绩单…… 2、在table中使用tr表示表格中的一行，有几个tr就有几行 3、tr中使用td表示一个单元格，有几个td就表示有几个单元格 合并单元格 colspan（横向合并单元格） 示例： <table&
table（表格）的简单介绍
qq_69761234的博客
05-20 1698
table（表格）的创建 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <table border="1" width="500" height="300" bgcolor="#eee"> <tr height="50"> <t
js创建table表格
02-14
js创建table表格，有下拉框，输入框，真实可用，适合使用，学习
Html——之table表格
一苇过江的博客
06-28 6054
表格（table）的应用： 表格的创建： <!doctype html> <html> <head> <meta charset="utf-8"> <title>test1</title> <--表格标记--> </head> <body> <table> <tr> <--行标记--> <td>第一行第一列</
HTML中table表格标签的基础学习教程
12-14
表格的标签组成HTML中的表格是由<table>为主体标签，浏览器会将该标签解释为一个表格。表格中的行使用标签进行定义。标签为<table>标签的子类，设置若干个标签可以将表格分割为若干个行。标签用于定义表格的列，标签...
HTML基础重点_一般标签、常用标签和表格
12-13
表格由`<table>`标签开始，可以设置宽度`width`、边框`border`、内容与边框的间距`cellpadding`和单元格间距`cellspacing`、对齐方式`align`以及背景色`bgcolor`或背景图片`background`。`<tr>`定义表格行，行内...
CSS.table.rar_Table_css table_table css_表格css
最新发布
09-20
- `<table>`：这是HTML中创建表格的基本标签，用于定义表格的结构。 - `<tr>`：表示表格行（Table Row），每个表格由多个行组成。 - `<th>`：表示表头单元格（Table Header），用于定义表格列的标题或表头信息。 ...
html用table标签制作表格
Boxzhang的博客
11-29 4631
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> table { border-collapse: collapse; } td{ width...
html--表格属性（一）
edison lee的博客
04-04 174
width ：  表格的宽度align  ：  表格相对周围元素的对齐方式border ： 规定了表格边框的宽度bgcolor  ：  表格的背景颜色.cellpadding  ：单元边沿与其内容之间的空白cellspacing   :   单元格之间的空白frame  ：  规定外侧边框的哪个部分是可见的{         void :  不显示外边框    above below ：分别显示上...
Table表格
erdouzhang
04-18 321
普通表格 <table border="1" cellpadding="10" cellspacing="0"> <caption>学生统计表</caption> <tr> <td>姓名</td> <td>年龄</td> <td>性别</td> </tr> <tr> <td>张三</td> <td>18</td> <td>男</td
Html5+Css3实现简单表格排版
isGt93的博客
10-02 2867
1.html5实现初步布局 CS 142 Project 1, Problem 1 --> --> Item Manufacturer Size Unit Price Quantity Total Price Corn Flakes Kellogg's 18 oz. 2.50 1 2.50 Solid White Tuna Starkist 5
<学习html>第五天笔记-表格table（创建表格、表格属性、表头标签、表格结构、表格标题标签、合并单元格）
a950809的博客
11-04 9303
表格table（创建表格、表格属性、表头标签、表格结构、表格标题标签、合并单元格）
table表格
JOJOxiaocai的博客
10-28 318
<table>主标签 <tr>行 <td></td>列 <td></td>列 </tr> </table> border 表格边框属性 colspan跨列 rowspan跨行 bordercolor 边框颜色 bgcolor 背景颜色 backetground 背景图片 align 对齐方式 valign 垂直对齐方式 cellspacing 单元格间
table标签及排版详解（一）
Demy_sunny的博客
05-04 1万+
先来看一个table的例子： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;例子&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="top"&gt; &lt;table class=&
解决bootstrap table表格插件所遇到的坑
热门推荐
jintingbo的专栏
10-02 5万+
效果图： 第一点：bootstrap tab好用,并且是前端分页（就是不需要去读后台数据库来辅助分页） 你下载了bootstrap，不是你就有了bootstrap table插件，你还得要下载bootstrap table插件； bootstrap下载地址：http://www.bootcss.com/ bootstrap table插件下载地址（下面3个有关）最好是从Github下载...
HTML——使用表格进行页面布局
笨鸟
10-23 1万+
简单的使用表格进行布局~
table表格总结
http_lanan的博客
11-03 728
表格1.0 表格的定义:“table”标签 定义HTML表格。简单的HTML表格由table元素以及一个或多个“tr”“td”元素组成表格结构；其中：“tr”元素定义表格行，“td”元素定义表格单元。也可用border,colspan,rowspan,align,bgcolor来美化表格。 一.表格的标签。 标签 用处 table 定义表格 thead 定义表格的页眉 th 表格表头 tr 定义表格的行 td 定义表格单元格 tbody 定义表格主体 tfoot 定义
HTML学习心得：掌握table与input标签详解
学习者首先了解了table标签的属性，如`align`用于设置表格的对齐方式（如居中对齐），`cellPadding`和`cellSpacing`控制单元格内的填充和单元格间的间距。此外，表格还支持事件处理，如可能通过JavaScript监听`click...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值