美文网首页
HTML之表格标签及属性

HTML之表格标签及属性

作者: 小王同学123321 | 来源:发表于2019-01-15 14:36 被阅读0次

一、表格的基本结构

<tabel>
    <tr>
        <th>......<th>
        <th>......<th>
    </tr>
    <tr>
        <td>......</td>
        <td>......</td>
    </tr>
</tabel>

二、表格的标签及属性简介

table:定义表格 
    tr:定义表格对的行 
    th:定义表格中的表头内容 
    td:定义表格的列
表格属性:
     border:表格边框 
    cellspacing:单元格间的间距
    cellpadding:单元格的内容与其边框的内边距 
    align:表格的对齐方式,通常是left,center,right
    bgcolor:表格的背景颜色 background:表格的背景图片
    width:表格宽度 height:表格高度
    border-collaspe:collaspe:边框合并,不叠加 
    cellspacing:0:边框合并,但合并之后的边框宽度等于前两个边框宽度之和
    caption:表格标题

三、单元格属性

width:单元格宽度height:单元格高度
align:单元格内文本的对齐方式,通常是左,中,右 left,center,right
valign:单元格内文本的对齐方式,通常是上,中,下 top,middle,bottom
nowrap:在为设置单元格宽度时,当文本长度宽于单元格宽度,将要换行时,该标签会使其不换行

四、表格的跨行与跨列
rowspan:跨行标签,表示跨了多少行
colspan:跨列标签,表示跨了多少列
跨行与跨列的组合使用举列:

<table border="3" bordercolor="plum" width="300" height="100" align="center" cellspacing="0">
    <tr>
        <td rowspan="6" background="../img/4.jpg"></td>
        <td rowspan="3"></td>
        <td rowspan="2"></td>
        <td></td>
    </tr>
    <tr>
        <td ></td>
    </tr>
    <tr>
        <td rowspan="2"></td>
        <td></td>
    </tr>
    <tr>
        <td rowspan="3"></td>
    <td></td>
    </tr>
    <tr>
        <td rowspan="2"></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
    </tr>
</table>
表格展示

五、表格标签拓展及其属性
thead:定义表格的表头
tbody:定义表格主体(正文)
tfoot:定义表格的页脚(脚注或表注)
colgroup:标签用于对表格中的列进行组合,以便对其进行格式化。
注意:不管thead、tbody、tfoot的代码先后顺序如何,html显示时,始终是先显示thead,再显示tbody,最后显示tfoot。
1、<thead> 内部必须拥有 <tr> 标签!
2、<tfoot> 元素内部必须包含一个或者多个 <tr> 标签。
3、<tbody> 元素内部必须包含一个或者多个 <tr> 标签。
4、必须在 table 元素内部使用这些标签。
5、当不同行间的单元格合并时各单元格所在的行不要加tbody标签。

相关文章

  • HTML学习心得(二)

    HTML 表格 表格中常用标签、属性及意义 HTML 列表 HTML无序列表 Coffee Milk 调...

  • HTML之表格标签及属性

    一、表格的基本结构 二、表格的标签及属性简介 三、单元格属性 四、表格的跨行与跨列rowspan:跨行标签,表示跨...

  • CSS 表格属性

    表格属性 CSS表格属性用于设置HTML表格的样式,HTML表格由 标签嵌套 , , 等标签组成,一个HTML...

  • HTML常用标签及属性

    什么是HTML HTML基本语法 常用标签及属性 链接 文本标记 表格 列表 表单 结构标记 什么是HTML HT...

  • HTML常用标签及属性

    什么是HTML HTML基本语法 常用标签及属性 链接 文本标记 表格 列表 表单 结构标记 本文知识来源MDN(...

  • html 大纲

    html 通用 html 简介 html 常用标签 html 属性 html 表格 html 字体 html 表单...

  • HTML之表格布局

    本文主要讨论表格的布局及美化。首先我们通过表1来看HTML中表格包含哪些标签及属性。 其中有几个属性是我们常用来实...

  • html列表,标签

    1、html列表 有序列表 无序列表 定义列表 2、html表格及传统布局 table常用标签 table常用属性...

  • Day09_表格表单和统筹

    学习目标 1、表单标签及属性高级 2、表格标签及属性高级 3、CSS统筹 4、BFC概念和应用场景 一、表单标签及...

  • HTML:表格实现

    作业内容 说明以下表格是如何实现的: 知识点:HTML 表格 表格标签 合并属性 边框属性 思路 如图实现思路: ...

网友评论

      本文标题:HTML之表格标签及属性

      本文链接:https://www.haomeiwen.com/subject/stkydqtx.html