HTML之table表格学习

 HTML table使用

thead、tbody、tfoot均可省略;

浏览器解析的时候会自动套上tbody

tr 行

td 列

th 标题列属性

colspan 列占用数

rowspan 行占用数

<!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><h3 style="text-align: center;">表格Demo</h3><table border="1px" align="center" style="align-items: center;width: 300px;"><thead><tr><!--行--><th>1</th><th>2</th><th>3</th><th>4</th></tr></thead><tbody><tr><!--行--><td>1</td><!--列--><td>2</td><td>3</td><td rowspan="7">4</td></tr><tr><td>1</td><td>zz</td><td>100</td></tr><tr><td>2</td><td>zz</td><td>100</td></tr><tr><td>3</td><td>zz</td><td>100</td></tr><tr><td>22</td><td colspan="2">20</td></tr><tr><td>33</td><td colspan="2">40</td></tr><tr><td>44</td><td colspan="2">50</td></tr></tbody><tfoot><!--有tfoot时 向下侵占不会占用tfoot中的单元格--><tr><td>4</td><td>ww</td><td>100</td></tr></tfoot></table>
</body></html>

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

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

相关文章

常用抓包工具tcpdump、Fiddler、Charles、Wireshark 和 Sniffmaster 下载地址

抓包大师官网下载地址 Sniff Master Download - Free TCP and HTTPS Proxy Sniffing Tool, Supports IOS Sniffing Fiddler classic官网下载地址 Download Fiddler Web Debugging Tool for Free by Telerik Fiddler Everywhere官网下载地址 The Ultimate Web Debugging Tool …

【PostgreSQL内核学习 —— (WindowAgg(二))】

WindowAgg WindowAggState 结构体窗口聚合行为ExecInitWindowAgg 函数ExecWindowAgg 函数代码逻辑解释&#xff1a;计算窗口偏移量代码逻辑详细解释&#xff1a; 代码逻辑解释&#xff1a;窗口聚合分区初始化与行推进逻辑代码逻辑详细解释&#xff1a; 代码逻辑解释&#xff1a…

区块链项目孵化与包装设计:从概念到市场的全流程指南

区块链技术的快速发展催生了大量创新项目&#xff0c;但如何将一个区块链项目从概念孵化成市场认可的产品&#xff0c;是许多团队面临的挑战。本文将从孵化策略、包装设计和市场落地三个维度&#xff0c;为你解析区块链项目成功的关键步骤。 一、区块链项目孵化的核心要素 明确…

【React】受控组件和非受控组件

目录 受控组件非受控组件基于ref获取DOM元素1、在标签中使用2、在组件中使用 受控组件 表单元素的状态&#xff08;值&#xff09;由 React 组件的 state 完全控制。组件的 state 保存了表单元素的值&#xff0c;并且每次用户输入时&#xff0c;React 通过事件处理程序来更新 …

C#开发的进销存管理系统软件

#### 介绍 进销存管理系统实现的功能及用途 含模块销售管理、采购管理、存货管理、库存管理、账款管理、用户管理、职员管理七个部分 进销存管理系统实现以下功能&#xff1a; 1. 库存管理 2. 应付账款和应收账款的统计 3. 对订单未结数量和采购单未结数量的统计 4. 权限的管理…

高性能 AI 处理器亲和性调度算法实现

目录 题目描述解题思路分析C 语言实现 生成组合的函数主程序实现C 语言代码使用示例Python 实现 生成组合的函数主程序实现Python 代码使用示例总结与展望题目描述 某公司研发的高性能 AI 处理器,每台物理设备 a 包含 8 颗 AI 处理器,编号为 0 - 7。其中,编号 0 - 3 的处理…

快手ip属地是定位吗?怎么改

在当今数字化时代&#xff0c;随着网络平台的不断发展&#xff0c;用户隐私和数据安全成为了公众关注的焦点。各大社交媒体平台纷纷推出的“IP属地”功能&#xff0c;无疑为网络环境增添了一抹新的色彩。其中&#xff0c;快手的IP属地显示功能尤为引人注目。那么&#xff0c;快…

Git 常用基础命令详解:init、add、commit

一、引言 在软件开发的世界里&#xff0c;版本控制是一项至关重要的技术&#xff0c;它就像是一个时光机器&#xff0c;让开发者能够追踪代码的每一次变化&#xff0c;轻松回溯到任意历史版本&#xff0c;同时也为多人协作开发提供了强大的支持。而 Git&#xff0c;作为目前最…

1-kafka服务端之延时操作前传--时间轮

文章目录 背景时间轮层级时间轮时间轮降级kafka中的时间轮kafka如何进行时间轮运行 背景 Kafka中存在大量的延时操作&#xff0c;比如延时生产、延时拉取和延时删除等。Kafka并没有使用JDK自带的Timer或DelayQueue来实现延时的功能&#xff0c;而是基于时间轮的概念自定义实现…

从零开始:OpenCV 图像处理快速入门教程

文章大纲 第1章 OpenCV 概述 1.1 OpenCV的模块与功能  1.2 OpenCV的发展 1.3 OpenCV的应用 第2章 基本数据类型 2.1 cv::Vec类 2.2 cv&#xff1a;&#xff1a;Point类 2.3 cv&#xff1a;&#xff1a;Rng类 2.4 cv&#xff1a;&#xff1a;Size类 2.5 cv&#xff1a;&…

网络工程师 (22)网络协议

前言 网络协议是计算机网络中进行数据交换而建立的规则、标准或约定的集合&#xff0c;它规定了通信时信息必须采用的格式和这些格式的意义。 一、基本要素 语法&#xff1a;规定信息格式&#xff0c;包括数据及控制信息的格式、编码及信号电平等。这是协议的基础&#xff0c;确…

vue如何解决跨域

文章目录 vue如何解决跨域1. 什么是跨域2. 如何解决2.1 CROS&#xff08;Cross-Origin Resource Sharing&#xff0c;跨域资源共享&#xff09;2.2 Proxy2.2.1 使用webpack proxy2.2.2 服务端代理转发2.2.3 通过nginx实现代理 vue如何解决跨域 1. 什么是跨域 跨域本质是浏览器…

算法与数据结构(括号匹配问题)

思路 从题干可以看出&#xff0c;只要给出的括号对应关系正确&#xff0c;那么就可以返回true,否则返回false。这个题可以使用栈来解决 解题过程 首先从第一个字符开始遍历&#xff0c;如果是括号的左边&#xff08;‘&#xff08;‘&#xff0c;’[‘&#xff0c;’}‘&…

在linux 中搭建deepseek 做微调,硬件配置要求说明

搭建 可参考 使用deepseek-CSDN博客 官方网站&#xff1a;DeepSeek DeepSeek 是一个基于深度学习的开源项目&#xff0c;旨在通过深度学习技术来提升搜索引擎的准确性和效率。如果你想在 Linux 系统上搭建 DeepSeek&#xff0c;你可以遵循以下步骤。这里我将提供一个基本的指…

mounted钩子函数里如何操作子组件的DOM?

在 Vue 的 mounted 钩子函数中,操作子组件的 DOM 可以通过几种方式实现,具体取决于对子组件的访问方式。以下是一些常用的方法: 一、使用 ref 引用 定义 ref在父组件中,给子组件添加一个 ref 属性,这样就可以在父组件中通过 this.$refs 访问到子组件的实例。 父组件示例…

vue2-为啥data属性是一个函数而不是对象

vue2-为啥data属性是一个函数而不是对象 1. data在vue实例和组件中的表现差异 vue实例的时候&#xff0c;data既可以是一个对象也可以是一个函数 new Vue({data:{//对象name:tom},data(){//函数return{name:tom}} })而在组件中定义data&#xff0c;只能是函数&#xff0c;如…

利用deepseek参与软件测试 基本架构如何 又该在什么环节接入deepseek

利用DeepSeek参与软件测试&#xff0c;可以考虑以下基本架构和接入环节&#xff1a; ### 基本架构 - **数据层** - **测试数据存储**&#xff1a;用于存放各种测试数据&#xff0c;包括正常输入数据、边界值数据、异常数据等&#xff0c;这些数据可以作为DeepSeek的输入&…

Word List 2

词汇颜色标识解释 词汇表中的生词 词汇表中的词组成的搭配、派生词 例句中的生词 我自己写的生词&#xff08;用于区分易混淆的词&#xff0c;无颜色标识&#xff09; 不认识的单词或句式 单词的主要汉语意思 不太理解的句子语法和结构 Word List 2 英文音标中文regi…

树欲静而凤不止

我不知道为什么要求一定要在抖音上举办婚礼&#xff1f;觉得唯一的一个作用&#xff0c;财力的体现。 做到了&#xff0c;就见了。让我觉得就像买见面一样。 见了不合适&#xff0c;该当如何&#xff1f; 这个对于认真找对象&#xff0c;真的很重要吗&#xff1f; 分钱给平台&…

kaggle比赛入门 - Spaceship Titanic (第一部分)

1. 导入packages import numpy as np import pandas as pd import matplotlib.pyplot as plt %matplotlib inline import seaborn as sns sns.set(styledarkgrid, font_scale1.4) from imblearn.over_sampling import SMOTE import itertools import warnings warnings.filter…