百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> HTML table属性你晓得多少,进来理解一下?
分享文章到:

HTML table属性你晓得多少,进来理解一下?

发布时间:09/01 来源:未知 浏览: 关键词:
HTML table属性你知道多少,进来理解一下?在html中表格标签的使用十分广泛,关于初学者很好入手,不外也有一些属性,可以使表格的功效极大晋升。利用得当,你会发明它会使页面变得清楚美妙。让我们好好学习HTML table属性吧。

什么是表格&表格的作用

什么是表格:由一些 被称之为 单元格的矩形框 依照从左到右从上到下的次序摆列到一起组成的

表格的作用:以必然的构造来显示信息的。

怎样使用table表格

定义表格:<table></table>

创立表行:<tr></tr>

创立列(单元格):<td></td>

留意:默许状况下,每行中的列数是统一的。

table表格的特点:

1、独占一行

2、宽度自顺应(由内容来决议)

table表格属性:

<table> 属性

  • width: 设定表格宽度

  • height: 设定表格高度

  • align: 设定 表格 在其 父元素中的水平对齐方式,取值:left,center,right

  • border: 边框,边框宽度,以px为单位的数值,px可以省略

  • cellpadding: 单元格内边距

  • 单元格边框与内容之间的间隔

  • cellspacing: 单元分外边距

  • 单元格与单元格之间或者单元格与表格之间的 间隔

  • bgcolor: 背景色彩

<tr> 属性

  • 1.align: 该行的内容 水平对齐方式

  • 2.valign: 该行的内容 垂直对齐方式,取值:top,middle,bottom

  • 3.bgcolor 该行的文本色彩

<td> 属性

  • width

  • height

  • align

  • valign

  • bgcolor

  • colspan设定单元格跨列

  • rowspan设定单元格跨行

3、table表格中的其他标志

1.<caption></caption>

作用:为表格定义标题

位置:表格正上方居中显示

                              <table>
                 <caption>标题</caption>
                 <tr>
                    <td></td>
                     <td></td>
                 </tr>
               </table>

2.行标题或列标题

列标题:第一行中的每一列,加粗,水平居中的结果显示

行标题:每行里面的第一列, 加粗,水平居中的结果显示

行(列)标题:<th></th>

<th></th>作用 与 <td></td>千篇一律

table边框合并:

属性:border-collapse

取值:

1.separate默许值,别离边框模式

2.collapse边框合并模式

table边框边距:

1.作用:设定相邻单元格边框之间的间隔(相似于cellspacing)

2.属性:border-spacing

取值:

1.取1个值:表示水安然平静垂直间距相等

2.取2个值:第一个值表示的 水平间距

第二个值表示的 垂直间距

两个值之间用 空格 隔开

3.要求

border-collapse必需为separate

必需为别离边框模式时有效

潜藏的显示结果:

属性: visibility:collap:se

用在表格元素上,删除一行或一列,不影响表格整个规划

【相关引荐】

html的根基元素,让你零根基学习HTML

什么是HTML文件?HTML文件的初步认识

以上就是HTML table属性你知道多少,进来理解一下?的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有153人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板