html基础-table标签

table标签，认识网页上的表格

有时候我们需要在网页上展示一些数据，如某公司想在网页上展示公司的库存清单。如下表：

想在网页上展示上述表格效果可以使用以下代码：

创建表格的四个元素：

table、tbody、tr、th、td

1、<table>…</table>：整个表格以<table>标记开始、</table>标记结束。

2、<tbody>…</tbody>：如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构， tbody包含行的内容下载完优先显示，不必等待表格结束后在显示，同时如果表格很长，用tbody分段，可以一部分一部分地显示。（通俗理解table 可以按结构一块块的显示，不在等整个表格加载完后显示。）

3、<tr>…</tr>：表格的一行，所以有几对tr 表格就有几行。

4、<td>…</td>：表格的一个单元格，一行中包含几对<td>...</td>，说明一行中就有几列。

5、<th>…</th>：表格的头部的一个单元格，表格表头。

6、表格中列的个数，取决于一行中数据单元格的个数。

上述代码在浏览器中显示的默认的样式为：

总结：

1、table表格在没有添加css样式之前，在浏览器中显示是没有表格线的

2、表头，也就是th标签中的文本默认为粗体并且居中显示

http://www.imooc.com/code/294

转载于:https://www.cnblogs.com/hmd180324/p/9245578.html

html基础-table标签相关推荐

HTML基础——table标签
HTML基础之table标签一.定义表格是网页中十分重要的组成元素.表格用来存储数据.表格包含标题.表头.行和单元格.在HTML语言中,表格标记使用符号<table>表示.定义表格仅使 ...
HTML基础————table标签
1.什么是table? table是html中的表格,由tr.td.th元素组成. tr 元素定义表格行,th 元素定义表头,td 元素定义表格单元 2.可选的属性属性描述 border 定义表格 ...
html中table标签、tr标签、th标签、td标签的基础知识
html中table标签.tr标签.th标签.td标签的基础知识表格的结构表格的基本标签表格标签的基本属性 table标签的基本属性 tr标签的基本属性 th和td标签的基本属性表格高级样式设 ...
html标签体,HTMLCSS基础-html标签的实体
HTML&CSS基础-html标签的实体作者:尹正杰版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML源代码尹正杰的网页我的博客地址:https://www.cnblog ...
html:(14):给div命名和table标签
给div命名,使逻辑更加清晰在上一小节中,我们把一些标签放进<div>里,划分出一个独立的逻辑部分.为了使逻辑更加清晰,我们可以为这一个独立的逻辑部分设置一个名称,用id属性来为< ...
PHP自学3——在html的table标签中显示用户提交表单
为了更好地显示用户提交表单,本节将在上一节的基础上将读取的用户表单显示在html的<table>标签中,这一节将用到和数组有关的知识. 本节代码将从外部文件(.txt文件)中读取信息于指定 ...
table标签，制作表格注册表
table标签,制作表格注册表今天复习了一下html,发现在表格,表单这一方面还是不够熟练,所以写了这篇文章,以便复查. 首先,来看看要做成的注册表: 性格测试表,一键生成你的性格表这里我用标题标 ...
java中table是什么标签_[Java教程]javascript格式化table标签内容
[Java教程]javascript格式化table标签内容 0 2015-07-12 20:00:08 项目中遇到这样的需求,一大段文章正文的html代码在手机中显示不全,原因是由于其它有table ...
table 标签的 rules 属性
rules 属性规定内侧边框的哪个部分是可见的. 从实用角度出发,最好不要规定 rules,而是使用 CSS 来添加边框样式. 值描述 none 没有线条. groups 位于行组和列组之间的线条. ...

html基础-table标签

table标签，认识网页上的表格

html基础-table标签相关推荐

最新文章

热门文章