表格标记<table>

一.表格标记、

1table:表格标记

2.caption:表单标题标记

3.tr:表格行标记

4.td:表格中数据单元格标记

5.th:标题单元格

table标记是表格中最外层标记,tr表示表格中的行标记,一对<tr>表示表格中的一行,在<tr>中可以嵌套几对<th>标记或几对<td>标记

 属性:

        width:设置表格或者单元格的宽度

        height:设置表格或者单元格的高度

        align:设置表格或者单元格中,文字水平对齐方式

        valign:设置单元格垂直对齐方式,可取top bottom middle baseline

        border:设置边框的值,默认为0,表示不可见

        bgcolor:背景颜色

        background:背景图片

    <!-- 属性:width:设置表格或者单元格的宽度height:设置表格或者单元格的高度align:设置表格或者单元格中,文字水平对齐方式valign:设置单元格垂直对齐方式,可取top bottom middle baseline border:设置边框的值,默认为0,表示不可见bgcolor:背景颜色background:背景图片 --><table align="center" border="4" width="300px" height="400px" bgcolor="yellow" ><caption>表格</caption><tr valign="top"><th>标题1</th><th>标题1</th></tr><!-- valign:这个属性只能放在tr td th标记中 --><tr valign="middle"><td >单元格1</td><td>单元格2</td></tr><tr valign="bottom"><td>单元格3</td><td>单元格4</td></tr></table>

留下一个小作业,这个用表格怎么写呢?

 这里直接贴上代码了哦

    <hr><table border="3" align="center" width="500px" bgcolor="yellow"><caption>个人简历表</caption><tr bgcolor="blue"><th>姓名</th><th>年龄</th><th>籍贯</th></tr><tr bgcolor="green"><td>东方翱翔</td><td>不告诉你</td><td>我也不告诉你</td></tr></table>

完整代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><!-- 属性:width:设置表格或者单元格的宽度height:设置表格或者单元格的高度align:设置表格或者单元格中,文字水平对齐方式valign:设置单元格垂直对齐方式,可取top bottom middle baseline border:设置边框的值,默认为0,表示不可见bgcolor:背景颜色background:背景图片 --><table align="center" border="4" width="300px" height="400px" bgcolor="yellow" ><caption>表格</caption><tr valign="top"><th>标题1</th><th>标题1</th></tr><!-- valign:这个属性只能放在tr td th标记中 --><tr valign="middle"><td >单元格1</td><td>单元格2</td></tr><tr valign="bottom"><td>单元格3</td><td>单元格4</td></tr></table><hr><table border="3" align="center" width="500px" bgcolor="yellow"><caption>个人简历表</caption><tr bgcolor="blue"><th>姓名</th><th>年龄</th><th>籍贯</th></tr><tr bgcolor="green"><td>东方翱翔</td><td>不告诉你</td><td>我也不告诉你</td></tr></table></body></html>

效果

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/428785.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Scrapy爬虫IP代理池:提升爬取效率与稳定性

在互联网时代&#xff0c;数据就是新的黄金。无论是企业还是个人&#xff0c;数据的获取和分析能力都显得尤为重要。而在众多数据获取手段中&#xff0c;使用爬虫技术无疑是一种高效且广泛应用的方法。然而&#xff0c;爬虫在实际操作中常常会遇到IP被封禁的问题。为了解决这个…

小程序构建npm失败

小程序构建npm失败 项目工程结构说明解决方法引入依赖导致的其他问题 今天在初始化后的小程序中引入TDesign组件库&#xff0c;构建npm时报错。 项目工程结构说明 初始化后的项目中&#xff0c;包含miniprogram文件夹和一些项目配置文件&#xff0c;在project.config.json文件中…

【TypeScript入坑】TypeScript 的复杂类型「Interface 接口、class类、Enum枚举、Generics泛型、类型断言」

TypeScript入坑 Interface 接口简介接口合并TS 强校验Interface 里支持方法的写入class 类应用接口接口之间互相继承接口定义函数interface 与 type 的异同小案例 class 类类的定义与继承类的访问类型构造器 constructor静态属性&#xff0c;Setter 和 Getter做个小案例抽象类 …

fiddler抓包06_抓取https请求(chrome)

课程大纲 首次安装Fiddler&#xff0c;抓https请求&#xff0c;除打开抓包功能&#xff08;F12&#xff09;还需要&#xff1a; ① Fiddler开启https抓包 ② Fiddler导出证书&#xff1b; ③ 浏览器导入证书。 否则&#xff0c;无法访问https网站&#xff08;如下图&#xff0…

(十五)、把自己的镜像推送到 DockerHub

文章目录 1、登录Docker Hub2、标记&#xff08;Tag&#xff09;镜像3、推送&#xff08;Push&#xff09;镜像4、查看镜像5、下载镜像6、设置镜像为公开或者私有 1、登录Docker Hub 需要科学上网 https://hub.docker.com/ 如果没有账户&#xff0c;需要先注册一个。登录命令如…

docker搭建个人网盘,支持多种格式,还能画图,一键部署

1&#xff09;效果 2&#xff09;步骤 2.1&#xff09;docker安装 docker脚本 bash <(curl -sSL https://cdn.jsdelivr.net/gh/SuperManito/LinuxMirrorsmain/DockerInstallation.sh)docker-compose脚本 curl -L "https://github.com/docker/compose/releases/late…

技术成神之路:设计模式(十四)享元模式

介绍 享元模式&#xff08;Flyweight Pattern&#xff09;是一种结构性设计模式&#xff0c;旨在通过共享对象来有效地支持大量细粒度的对象。 1.定义 享元模式通过将对象状态分为内部状态&#xff08;可以共享&#xff09;和外部状态&#xff08;不可共享&#xff09;&#xf…

基于SpringBoot+Vue的高校竞赛管理系统

作者&#xff1a;计算机学姐 开发技术&#xff1a;SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等&#xff0c;“文末源码”。 专栏推荐&#xff1a;前后端分离项目源码、SpringBoot项目源码、SSM项目源码 系统展示 【2025最新】基于JavaSpringBootVueMySQL的…

力扣115-不同的子序列(Java详细题解)

题目链接&#xff1a;不同的子序列 前情提要&#xff1a; 因为本人最近都来刷dp类的题目所以该题就默认用dp方法来做。 dp五部曲。 1.确定dp数组和i下标的含义。 2.确定递推公式。 3.dp初始化。 4.确定dp的遍历顺序。 5.如果没有ac打印dp数组 利于debug。 每一个dp题目…

java使用ByteBuffer进行多文件合并和拆分

1.背景 因为验证证书的需要&#xff0c;需要把证书文件和公钥给到客户&#xff0c;考虑到多个文件交互的不便性&#xff0c;所以决定将2个文件合并成一个文件交互给客户。刚开始采用字符串拼接2个文件内容&#xff0c;但是由于是加密文件&#xff0c;采用字符串形式合并后&…

界面控件Telerik UI for WinForms 2024 Q3概览 - 支持合并单元格等

Telerik UI for WinForms拥有适用Windows Forms的110多个令人惊叹的UI控件。所有的UI for WinForms控件都具有完整的主题支持&#xff0c;可以轻松地帮助开发人员在桌面和平板电脑应用程序提供一致美观的下一代用户体验。 本文将介绍界面组件Telerik UI for WinForms在今年第一…

LeetCode2414题: 最长的字母序连续子字符串的长度(原创)

【题目描述】 字母序连续字符串 是由字母表中连续字母组成的字符串。换句话说&#xff0c;字符串 "abcdefghijklmnopqrstuvwxyz" 的任意子字符串都是 字母序连续字符串 。 例如&#xff0c;"abc" 是一个字母序连续字符串&#xff0c;而 "acb" 和…

vscode中如何配置c/c++环境

“批判他人总是想的太简单 剖析自己总是想的太困难” 文章目录 前言文章有误敬请斧正 不胜感恩&#xff01;一、准备工作二、安装 VSCode 插件三、配置 VSCode1. 配置编译任务&#xff08;tasks.json&#xff09;2. 配置调试器&#xff08;launch.json&#xff09; 四、运行和调…

Gitee Pipeline 从入门到实战【详细步骤】

文章目录 Gitee Pipeline 简介Gitee Pipeline 实战案例 1 - 前端部署输入源NPM 构建Docker 镜像构建Shell 命令执行案例 2 - 后端部署全局参数输入源Maven 构建Docker 镜像构建Shell 命令执行参考🚀 本文目标:快速了解 Gitee Pipeline,并实现前端及后端打包部署。 Gitee Pi…

Fabric:布匹纺织缺陷检测数据集(猫脸码客 第195期)

布匹数据集在纺织工业中的应用与探索&#xff1a;从布匹检索到纹理检测 引言 在快速发展的纺织工业中&#xff0c;信息技术的深度融合正逐步推动产业向智能化、精细化转型。其中&#xff0c;布匹数据集作为连接传统制造与数字技术的桥梁&#xff0c;其在布匹检索、纹理检测等…

【数据结构与算法 | 灵神题单 | 二叉搜索树篇】力扣99, 1305, 230, 897

1. 力扣99&#xff1a;恢复二叉搜索树 1.1 题目&#xff1a; 给你二叉搜索树的根节点 root &#xff0c;该树中的 恰好 两个节点的值被错误地交换。请在不改变其结构的情况下&#xff0c;恢复这棵树 。 示例 1&#xff1a; 输入&#xff1a;root [1,3,null,null,2] 输出&…

Python “函数” ——Python面试100道实战题目练习,巩固知识、检查技术、成功就业

本文主要是作为Python中函数的一些题目&#xff0c;方便学习完Python的函数之后进行一些知识检验&#xff0c;感兴趣的小伙伴可以试一试&#xff0c;含选择题、判断题、实战题、填空题&#xff0c;答案在第五章。 在做题之前可以先学习或者温习一下Python的函数&#xff0c;推荐…

第一次安装Pytorch

1、新版本的Anaconda内置的python版本是3.12&#xff0c; 目前 Windows 上的 PyTorch 仅支持 Python 3.8-3.11;不支持 Python 2.x。 1、创建运行环境 在不创建虚拟环境的情况下&#xff0c;不建议使用最新的Python和Anaconda。 在几次失败后&#xff0c;我使用的是Anaconda3-2…

Java反序列化利用链篇 | CC6链分析(通用版CC链)

文章目录 CC6和CC1之间的区别CC6的调用链构造CC6的payload完成TiedMapEntry.getValue()完成TiedMapEntry.hashCode()完成HashMap.hash()及HashMap.readObject()解决hash()方法提前触发的问题 系列篇其他文章&#xff0c;推荐顺序观看~ Java反序列化利用链篇 | JdbcRowSetImpl利…

【python计算机视觉编程——10.OpenCV】

python计算机视觉编程——10.OpenCV 10.OpenCV10.2 OpenCV基础知识10.2.1 读取和写入图像10.2.2 颜色空间10.2.3 显示图像及结果 10.3 处理视频10.3.1 视频输入10.3.2 将视频读取到NumPy数组中 10.4 跟踪10.4.1 光流10.4.2 Lucas-Kanade算法使用跟踪器使用发生器 10.5 更多示例…