三分钟学会HTML中的表格制作

1、表格

①表格:简单来说就是指单元格组成的

②表格的作用:相对来说,表格的作用很简单,就是日常用于放数据的呗

③表格的制作无非不就是三个词:table 、tr、 td ,其他的就是加属性,多的不说,上图代码来实现在这里插入图片描述在这里插入图片描述
在这里插入图片描述
其中width、height 是代表着宽度和高度 设的值越大,则表格越大
cellspacing:是表示着单元格与单元格之间的距离cellspacing给的值越大说明单元格之间的就越大,反之则相同
*注意:这个值不能小于0
border:表示着线框的属性 :
第一个值是线条的宽度
第二个值是线条的样子有solid(实线)、dashed(虚线)、dotted(点线)
第三个值是线条的颜色 表示的方法有 直接用单词、十六进制、以及rgb和rgba

这些border也可以对单边使用border-top、border-right、border-bottom、border-left(上右下左)
align:代表着表格水平的位置

一个表格做完也要有必须的标题咯,不多说,上图展示
在这里插入图片描述
在这里插入图片描述
其表示当然为caption,里面加标题就可了。当然capting必须是在跟在table后面的的 而且caption只能存在一个。

接下来我们就来说说表格的运用 ,简单来说就是表格的横向和纵向的合并
实例来说吧
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
简单明了就是 两个词 colspan和 rowspan 代表着横向和纵向 给的值就是要合并的多少个单元格(包含本身)

拓展一下

cellpdding:表示单元格边框和内容之间的距离

在tr中aglin调整一整行的位置、还有 width 在突然中是不生效的
还有vaglin是垂直位置 有(top 、middle 、 bottom)
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/joyouscola/article/details/111147655