HTML表格属性有哪些?HTML表格10种基本属性的总结

html表格属性设置在html网页中的应用是十分广泛的,也是至关重要的,所以,接下来的这篇文章我给大家分享了总结的html表格10种基本属性,下面我们来分别看一看这10种表格属性的介绍以及具体的代码。

1、HTML table属性

用来定义HTML的表格,具有本地属性 border 表示边框,border属性的值必须为1或空字符串(“”)。该属性不会控制边框的样式,而是由CSS来控制

table元素可以有tr,th,td,thead,tbody,tfoot,colgroup元素

table标签的基本属性如下:

立即学习“前端免费学习笔记(深入)”;

border:可以的取值为1和0,1代表有边框,0代表没有边框。

bordercolor:可以设置边框的颜色,值为颜色值。

bgcolor:设置表格的背景颜色

background:设置背景图片

2、html tr属性

用来定义表格的一行。由于HTML表格是面向行的,所以必须分别表示每一行

tr元素可以在table,thead,tbody和tfoot元素内使用

tr元素内可以包含一个或者多个td或th元素

它的align,bgcolor等属性已过时,如果要设置属性,请使用CSS设置

3、HTML td属性

  用来定义表格单元格,可以同colspan,rowspan,headers局部属性使用

  (1)colspan: 列跨度,该属性规定了单元格可横跨的列数,该属性的值必须是整数

  (2)rowspan:行跨度,该属性规定了单元格可横跨的行数,该属性的值必须是整数

  (3)headers:该属性的值是一个或多个单元的ID属性值,将单元格与列标题相关联,可用于使用屏幕阅读器

注意:每个表格必须包含以上三个元素

 4、html th属性

  用来定义标题单元格,使我们有效区分数据及其描述

  它同

 元素具有相同的局部属性,两者有如下区别:

是表示头标记,通常位于首行或者首列。而且 中的文字默认会被加粗,而

是不会的

是数据标记,表示单元格的具体的数据

        valign属性可以设置th和td,可以取值Top或者Bottom。

       callpadding:内容与单元格边框的间距

      cellspacing:防止文本超出边框

      如果要使单元格实现跨行或者跨列功能,使用属性colspan和rowspan.

 5、HTML thead属性

  用来定义表格的页眉,表头的包装器。可以定义一行或多行,这些行是 table 元素的列标签

  没有thead元素,所有的tr被假定为属于表的主体

6、HTML tbody属性

  用来定义表格的主体

7、HTML tfoot属性

  用来定义标记表格的页脚

注意:

标签内部必须拥有 标签

标签不管放在  标签内的哪个位置,都会被分别定为到表格的头部和底部。 可以出现在

或之前或之后。

在html5之前,

元素必须出现在

元素之前,在html5中,可以将

元素放在

或最后一个元素后面

8、html colgroup属性

  用来定义表列组,可以使用其来将样式应用于某个列,当然也可以使用下面要说的col元素

  具有局部属性 span 的 

表示列组应该横跨的列数。默认是一列,即对表格的一列设置样式

  

可以包含一个或多个 元素

9、HTML col属性

  用来表示表单个列,建议使用

包裹 元素而不是 直接设置span属性定义组

  

也具有局部属性span

  

放在 的元素内部, 的咩哥实例表示组中的一列。使用该标签可以将样式应用于列的组和该组的单个列

10、html caption属性

  用来定义表格的标题,每个表中只能包含一个

元素

11、实例代码:

  1.     

登录后复制        

表格示例

                    

标题1

            

标题2

            

标题3

                            左            中            右                            top            center            bottom            

运行结果:

HTML表格属性有哪些?HTML表格10种基本属性的总结

单元格跨行

  1.  

登录后复制登录后复制       

单元格的跨行

                  

姓名

           

电话

                         【创想鸟】           123456   654321          

运行结果:

HTML表格属性有哪些?HTML表格10种基本属性的总结

单元格跨列

  1.  

登录后复制登录后复制     

单元格跨列

              

姓名

         

电话

                   【创想鸟】         123456                            654231      

运行结果:

HTML表格属性有哪些?HTML表格10种基本属性的总结

相关推荐:

html表格属性_html/css_WEB-ITnose

详解HTML中table表格的frame和rules属性

以上就是HTML表格属性有哪些?HTML表格10种基本属性的总结的详细内容,更多请关注【创想鸟】其它相关文章!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    HTML中position的属性值介绍

    2025-3-9 4:19:01

    编程技术

    HTML表单是什么?HTML表单内容的详细介绍(附代码)

    2025-3-9 4:19:09

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索