我是靠谱客的博主 任性火车,最近开发中收集的这篇文章主要介绍html表格怎么做,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

本文操作环境:windows7系统、HTML5版、Dell G3电脑。

制作表格我们需要使用标签table在html中输入table标签,然后设置行和列,,tr代表行,td代表列,然后在行和列中输入相关的内容。

1fd9aaab323be0b411c69a715f3d3b4.png

预览网页我们发现,网页显示格式看起来不像是表格,因为没有框线,这时候我们需要给table标签设置边框,border,如图所示,在table标签中,定义border的值,这样再预览网页我们就可以看到表格样式。

b9c1f7f6469adfcb340b05590ee899f.png

图中的表格表头和文本内容显示格式一致,我们可以使用th标签代替td标签作为表格的表头,系统自动将表头内部的文本内容加粗居中显示,这样表头格式就被着重定义出来。

2793ae38435aa182c1a877493756260.png

可以使用caption标签给表格添加标题,caption是table标签的子标签需要写在table标签内部,将需要定义的标题文本输入到caption中。

f351dc73bd40230faff81415624ee9c.png

两行数值一样的话可以设置为rowspan值,如图所示,两行数据一致,直接设置rowspan值为2,下一行的这个数值就不必单独定义了,如果是三行数值一致,那么可以直接设置为3.

9c41739d38baed5a08c850cc930cf8a.png

将多列相同数据一起显示可以使用colspan来进行设置,如图所示,第三列所有的内容都全部显示一致,我们可以设置像表格中的合并效果然后一起显示,这样就不必每一列都输入内容。

33319b75d902fa3ff09b8e1657c2660.png

最后

以上就是任性火车为你收集整理的html表格怎么做的全部内容,希望文章能够帮你解决html表格怎么做所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(70)

评论列表共有 0 条评论

立即
投稿
返回
顶部