代码编织梦想

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>表格相关的标一些签</title>
    </head>
    <body>
        <!--
            需求 1:做一个四行,三列的表格,并显示边框
            需求 2:修改表格的宽度,高度,表格的对齐方式,单元格间距。
                table 标签是表格标签
                    相关属性:
                        border 设置表格边框
                        width 设置表格宽度
                        height 设置表格高度
                        align 在table中设置表格相对于页面的对齐方式
                                left 左对齐
                                center 居中对齐
                                right 右对齐

                                
                                align 出现在td标签中是设置对应单元格文本对齐方式
                                         出现在tr标签中是设置对应行所有单元格中的内容对齐方式
                                         出现在table标签中是设置表格在网页中对齐方式

                        cellspacing 设置单元格间距  "0"表示两条边线挨在一起,变成一条线。
                tr 是行标签
                th 也是单元格标签 与td标签相比多了"加粗"和"居中"功能
                td 是单元格标签

        -->
        <!--
            单元格合并:
                单元格合并是针对相邻单元格而言
                相邻行单元格合并:需要先删除下面的单元格,然后在上面的单元格标签中添加属性:rowspan="2"
                相邻列单元格合并:对是删除左边还是右边的单元格没有要求,在保留的单元格标签中添加属性:colspan="2"

        -->
        <!--
            thead(头)、tbody(体)、tfoot(脚)这三个标签是为了js代码更方便操作表格而出现的标签,它们不是必须的。
        -->
        <table align="center" border="1" width="300" height="300" cellspacing="0">
            <tr>
                <th>编号</th>
                <th>姓名</th>
                <th>住址</th>
            </tr>
            <tr>
                <td colspan="2">1.1</td>
                <!-- <td>1.2</td> -->
                <td rowspan="2">1.3</td>
            </tr>
            <tr>
                <td>2.1</td>
                <td>2.2</td>
                <!-- <td>2.3</td> -->
            </tr>
            <tr>
                <td>3.1</td>
                <td align="center">3.2</td>
                <td>3.3</td>
            </tr>
        </table>
    </body>
</html>

在网页中的展示效果如下图:

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/heliuerya/article/details/128764651

对表格和表单的介绍,标签嵌套原则。-爱代码爱编程

上一篇稍微说了一下HTML和标签,这一篇进行一次简单的总结,并且初识css。  一。首先说一下表格标签即<table></table>标签 ①. <table>...</table>:整个标签是以<table>标记开始、以</table>标记结束。 <tr>.

html常用标签及表格、表单、列表_alexmyh的博客-爱代码爱编程_表格标签有哪些

1:HTML常用标签 <a href=" ">这是一个链接</a> //href="#"空链接 <a href=" " target="_blank">新窗口打开&l

表格的标签和一些属性,怎样在html中插入图片。-爱代码爱编程

表格的标签和一些基本属性。 表格: 表格的标签必须以table开始/tabl结束。table标签里有两个标签th和td。 th  是表格的行。td  是表格的列 border是table标签的属性,border要写在table标签的后面并且属性和标签之间要要隔一个空格。比如:<标签 属性="属性值"> 下面是table标签的

表格table标签的属性及使用方式_crazy柯不再c的博客-爱代码爱编程

表格 table 创建表格 在HTML网页中,要想创建表格,就需要使用表格相关的标签。创建表格的基本语法格式如下: <table> <tr> <td>单元格内的文字<

html表格标题标签_HTML标题标签-爱代码爱编程

html表格标题标签 The headings are an important aspect in a document. The heading could be provided on the webpage through HTML. 标题是文档中的重要方面。 该标题可以通过HTML在网页上提供。 There six types

表格标签 table标签 tr标签 单元格间距 单元格居中加粗 表单居中-爱代码爱编程

table标签 table标签是表格标签 用这个可以创建一个表格 在标签中可以设置表格的相关属性tr标签和td标签 一个<tr></tr>标签代表一行 一个<td></td>代表一个单元格(一行中的一个元素)width hight是css样式 控制表的高和宽borger标签语法:border="1"可用来给表

dw常用标签_Dreamweaver里标签及属性详解-爱代码爱编程

《》 Dreamweaver 里标签及属性的详细解释 Dreamweaver 标签库可以帮助我们轻松的找到所需的标签 , 并根据列出的属性参 数使用它 , 常用的 HTML 标签和属性解释 , 请搜索 " 常用的 HTML 标签和属性 ". 基本结构标签 : , 表示该文件为 HTML 文件 包含文件的

html表格怎么绑定数据类型,Excel中表格添加数据标签及设置格式的操作方法-爱代码爱编程

Excel图表以其直观的展示功能深受用户喜爱,但有些初学者对于生成图表后如何添加数据标签有所困扰,今天,学习啦小编就教大家在Excel中表格添加数据标签及设置格式的操作方法。 Excel中表格添加数据标签及设置格式的操作步骤如下: 1、在Excel中打开已经生成图表的XLS文件,如下图所示; 2、在图表折线上点击鼠标右键,在弹出的快捷菜单中,

html表格标题居于标题左侧,css如何设置表格标题(caption标签)的位置-爱代码爱编程

我们可以通过设置css caption-side属性的相关属性值来指定表格( 在table表格中,caption标签是用于为表格提供简短的标题,如标题或简短描述。caption标签是插在开始 我们可以使用caption-side属性,来在表的上方或下方定位表格标题,指定标题位于表格的上方或下方。 注: 1、在CSS 2.1之前,提供了两个值

html表头的标签,HTML 表头单元格标签-爱代码爱编程

HTML 标签 标签定义及使用说明 标签定义 HTML 表格中的表头单元格。 HTML 表格有两种单元格类型:表头单元格 - 包含头部信息(由 元素创建) 标准单元格 - 包含数据(由 元素创建) 元素中的文本通常呈现为粗体并且居中。 元素中的文本通常是普通的左对齐文本。 浏览器支持 所有主流浏览器都支持 标签。

Table 表格,dl dt dd 标签-爱代码爱编程

Html常用标签 一、Table 表格1.语法2.作用3.案例二、dl dt dd 标签1.简介2.语法3.案例 一、Table 表格 1.语法 <table> <tr> <td>&nbsp;</td> <td>&n

前端笔记04 - 表格标签-爱代码爱编程

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="view

HTML常用标签之表格标签-爱代码爱编程

一、表格主要作用 表格主要是用于显示、展示数据,而不是用来布局页面的。 二、表格的基本语法 1.<table></table>是用于定义表格的标签; 2.<tr></tr>标签用于定义表格中的行,必须嵌套在<table></table>标签中; 3.<td><

web前端学习笔记02 —— html基础-爱代码爱编程

目录 一、列表标签 1.1 无序列表 1.2 有序列表  1.3 自定义列表 二、表格标签 2.1 表格的基本标签 2.2 表格的相关属性 2.3 表格标题和表头单元格标签 2.4 表格的结构标签 (了解) 2.5 合并单元格 三、表单标签  3.1 input系列标签 3.2 button按钮标签 3.3 select下拉菜单