HTML 表格跨行跨列

article/2025/11/11 17:24:10

HTML和CSS第一天

 8.8跨行跨列表格（次重点，必须掌握）

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>9-表格的跨行跨列</title>
</head>
<body>
<!--需求： 一个五行五列的表格第一行，第一列的单元格要跨两列第二行第一列的单元格跨两行，第四行第四列的单元格跨两行两列。colspan  属性设置跨列rowspan  属性设置跨行-->
<table border="1" width="300" height="300" cellspacing="0" align="center"><tr><th colspan="2">1.1</th>
<!--    <td>1.2</td>-->
<!--    第一行第二列 删掉  被第一行第一列覆盖--><td align="center">1.3</td><td>1.4</td><td>1.5</td></tr><tr><th rowspan="2">2.1</th>
<!--    覆盖掉第三行第一列--><td>2.2</td><td>2.3</td><td>2.4</td><td>2.5</td></tr><tr>
<!--    <th>3.1</th>-->
<!--    被第二行第一列所覆盖 删掉--><td>3.2</td><td>3.3</td><td>3.4</td><td>3.5</td></tr><tr><th>4.1</th><td>4.2</td><td>4.3</td><td colspan="2" rowspan="2" align="center"><b>4.4</b></td>
<!--    覆盖掉原本的第四行第五列和第五行第四列，第五行第五列-->
<!--    <td>4.5</td>-->
<!--   被第四行第四列所覆盖掉--></tr><tr><th>5.1</th><td>5.2</td><td>5.3</td>
<!--    <td>5.4</td>-->
<!--    <td>5.5</td>-->
<!--    上两个单元格都被第四行第四列所覆盖掉了--></tr></table>
</body>
</html>

   ![代码运行结果](https://img-blog.csdnimg.cn/20210712170338504.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81MzQ1Njg0OQ==,size_16,color_FFFFFF,t_70)

代码运行结果


http://chatgpt.dhexx.cn/article/vPXInGPr.shtml

相关文章

HTML表格跨行、跨列操作(rowspan、colspan)

HTML表格跨行、跨列操作(rowspan、colspan)

一般使用<td>元素的colspan属性来实现单元格跨列操作&#xff0c;使用<td>元素的rowspan属性来实现单元格的跨行操作。 colspan属性规定单元格可横跨的列数&#xff0c;所有浏览器都支持colspan属性。其取值为number&#xff0c;如下图所示&#xff1a; 例如&#…
阅读更多...
跨行转账汇款处理流程

跨行转账汇款处理流程

一.跨行转账汇款业务介绍 有了大小额系统和超级网银&#xff0c;银行的跨行业务就有意思了。银行对不同的客群和不同的场景&#xff0c;做了不同的渠道。我们最经常接触的大概就是银行柜台、手机网银、POS机和ATM机。出于各种商业目的&#xff0c;不同渠道的业务采用不同的清算…
阅读更多...
cmake+gtest

cmake+gtest

项目中想用google test&#xff0c;项目也是用cmake管理的。 于是想用cmake 添加gtest set(CMAKE_PREFIX_PATH"/path/to/gtest/install/path/cmake/path"${CMAKE_PREFIX_PATH})enable_testing()set(GTEST_ROOT "/path/to/gtest/install/path")find_packag…
阅读更多...
熟悉使用gtest

熟悉使用gtest

文章目录 1&#xff1a;介绍1.1、什么是gtest1.2、断言 2、gtest的简单使用3、gtest系列之事件机制4、gtest系列之死亡测试 1&#xff1a;介绍 1.1、什么是gtest gtest是一个跨平台的(Liunx、Mac OS X、Windows、Cygwin、Windows CE and Symbian)C单元测试框架&#xff0c;由…
阅读更多...
gtest测试

gtest测试

环境安装 1、下载gtest1.8版本 wget https://github.com/google/googletest/archive/refs/tags/release-1.8.1.zip 2、将其解压在“.../gtest/”目录下&#xff0c;解压命令&#xff1a; unzip release-1.8.1.zip 3、配置 解压后产生文件googletest-release-1.8.1&#x…
阅读更多...
GTest 总结

GTest 总结

Google C单元测试框架&#xff08;简称Gtest&#xff09;&#xff0c;可在多个平台上使用&#xff08;包括Linux, Mac OS X, Windows, Cygwin和Symbian&#xff09;&#xff0c;它提供了丰富的断言、致命和非致命失败判断&#xff0c;能进行值参数化测试、类型参数化测试、“死…
阅读更多...
GTest

GTest

参考链接: https://blog.csdn.net/linhai1028/article/details/81675724 https://www.cnblogs.com/helloworldcode/p/9606838.html 一.gtest简介 是Google的一套用于编写C测试的框架&#xff0c;可以运行在很多平台上&#xff08;包括Linux、Mac OS X、Windows、Cygwin等等&am…
阅读更多...
GTest从入门到入门

GTest从入门到入门

GTest从入门到入门 1 GTest简介 GTest是Google的开源库&#xff0c;是一个功能强大的跨平台C测试功能库。对于非测试工程师的开发人员来说&#xff0c;学习GTest有利于进行代码的单元测试。 GTest的功能不止于单元测试&#xff0c;事实上&#xff0c;GTest可以适用于各种测试…
阅读更多...
gtest--单元测试

gtest--单元测试

文章目录 gtest单元测试1.gtest的优点2.搭建测试框架 gtest单元测试 gtest是Google的一套用于编写C测试的框架&#xff0c;可以运行在很多平台上&#xff08;包括Linux、Mac OS X、Windows、Cygwin等等&#xff09;。基于xUnit架构。支持很多好用的特性&#xff0c;包括自动识别…
阅读更多...
gtest教程(记录小白从0学习gtest的过程)

gtest教程(记录小白从0学习gtest的过程)

gtest使用教程 1 简介 之前对gtest一无所知,最近,找了些相关的资料,学习了下.这里主要记录了学习过程和相关知识点. 什么是gtest: gtest测试框架是在不同平台上&#xff08;Linux&#xff0c;Mac OS X&#xff0c;Windows&#xff0c;Cygwin&#xff0c;Windows CE和Symbian…
阅读更多...
gtest单元测试框架介绍及简单使用

gtest单元测试框架介绍及简单使用

Gtest介绍 Gtest是Google的一个开源框架&#xff0c;它主要用于写单元测试&#xff0c;检查真自己的程序是否符合预期行为。可在多个平台上使用&#xff08;包括Linux, Mac OS X, Windows, Cygwin和Symbian&#xff09;。它提供了丰富的断言、致命和非致命失败判断&#xff0c…
阅读更多...
java用户行为日志记录方法_简单易用的开源用户操作日志记录系统

java用户行为日志记录方法_简单易用的开源用户操作日志记录系统

我们开发的业务系统通常会提供给很多人使用，那在使用的过程中，日志系统变得非常重要。 日志系统记录的用户行为有以下的作用： 从系统用户角度看：它展示了用户自身的操作历史和具体对象的变动历史，便于用户进行梳理 从系统管理员角度看：它可以记录了所有用户操作，便于我们…
阅读更多...
后台管理系统操作日志模块设计思路

后台管理系统操作日志模块设计思路

背景 对于很多后台管理系统来说&#xff0c;权限较多&#xff0c;对系统操作的人也会多。如此以来&#xff0c;对于一些操作的记录就非常有必要了&#xff0c;从而可以清楚的追踪对系统进行操作的人以及做了哪些操作&#xff0c;并且可以快速排查定位一些问题。下面简单说一下…
阅读更多...
绿盟日志审计系统

绿盟日志审计系统

绿盟日志审计系统 LINUX系统连接agent步骤 - -华龙在飞翔 1.对应虚拟化环境中连接的Linux服务器打开输入用户名和密码 2.ifconfig来查找Linux服务器对应的网段ip地址 3.使用finalshell等工具用ip地址连接对应的Linux服务器 4.cd /opt对于文件夹上传&#xff0c;也可以直接对…
阅读更多...
服务器怎么导出系统日志,服务器操作系统日志导出

服务器怎么导出系统日志,服务器操作系统日志导出

服务器操作系统日志导出 内容精选 换一换 简要介绍Rsyslog是一个集中日志管理工具，基于流行的服务端/客户端模式，通过TCP或者UDP传输协议来发送日志信息，或者从网络设备、服务器、路由器、交换机、以及其它系统或嵌入式设备中接收生成的日志。语言：C一句话概述：集中日志管…
阅读更多...
日志管理方法及系统

日志管理方法及系统

摘要 本发明涉及应用系统日志管理技术领域&#xff0c;提供了一种日志管理方法和系统&#xff0c;所述方法包括如下步骤&#xff1a;S1&#xff1a;初始化系统业务功能列表和业务功能方法列表&#xff1b;S2&#xff1a;将业务操作中的具体操作信息与系统日志表和历史数据日志表…
阅读更多...
轻量级分布式日志管理系统Graylog、Loki及ELK的分析和对比

轻量级分布式日志管理系统Graylog、Loki及ELK的分析和对比

1. 为什么需要集中的日志系统&#xff1f; 在分布式系统中&#xff0c;众多服务分散部署在数十台甚至是上百台不同的服务器上&#xff0c;要想快速方便的实现查找、分析和归档等功能&#xff0c;使用Linux命令等传统的方式查询到想要的日志就费时费力&#xff0c;更不要说对日…
阅读更多...
Web实时日志输出查看管理系统

Web实时日志输出查看管理系统

开发人员无权限访问生产服务器,怎样查看日志来分析问题? 安全管理合规的原因,开发未被授权访问生产服务器,但经常会有分析问题查看日志的需求. 大家一般是怎样解决的? 我尝试用过的,或者是想到的方法主要有如下几种,但都不太完美,有更好的方案或者工具吗? 开源产品 logio…
阅读更多...
服务器系统日志保留时间设置,服务器行为操作日志

服务器系统日志保留时间设置,服务器行为操作日志

服务器行为操作日志 内容精选 换一换 日志记录网管操作的信息以及NetEco中发生的重要事件。通过查询日志信息可以了解NetEco的运行情况和网管的具体操作情况。 为加强对系统数据的容灾管理，云堡垒机支持配置日志备份，提高审计数据安全性和系统可扩展性。本小节主要介绍如何在…
阅读更多...
Qt--日志系统

Qt--日志系统

一、前言 程序猿在开发的过程中是避免不了调试的&#xff0c;在Qt中除了打断点调试之外&#xff0c;我们常常还会用到QDebug来输出信息用于定位程序的问题。但是程序一旦打包发布给用户使用&#xff0c;release版本是看不到打印信息的&#xff0c;这样在碰到一些问题时就无法快…
阅读更多...
推荐文章

Copyright @ 2022~2023