当前位置: 首页 > news >正文

HTML标签——表格标签

HTML标签——表格标签

目录

  • HTML标签——表格标签
  • 一、表格标题和表头单元格标签
    • 场景:
    • 注意点:
    • 案例实操
    • 小结
  • 二、表格的结构标签
    • 场景:
    • 注意点:
    • 案例实操:
  • 三、合并单元格
    • 思路
      • 场景:
    • 代码实现

一、表格标题和表头单元格标签

场景:

在表格中表示整体大标题和一列小标题

其他标签:
在这里插入图片描述

注意点:

• caption标签书写在table标签内部
• th标签书写在tr标签内部(用于替换td标签)

案例实操

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><table border="1"><caption><strong>学生成绩单<strong></caption><tr><th>姓名</th><th>成绩</th><th>评语</th></tr><tr><td>张三</td><td>100</td><td>真棒,第一名</td></tr><tr><td>李四</td><td>99</td><td>真棒,第二名</td></tr><tr><td>总结</td><td>郎才女貌</td><td>真棒,相亲成功</td></tr></table></body>
</html>

在这里插入图片描述

小结

在这里插入图片描述

二、表格的结构标签

场景:

让表格的内容结构分组,突出表格的不同部分(头部、主体、底部),使语义更加清晰
结构标签:
在这里插入图片描述

注意点:

• 表格结构标签内部用于包裹tr标签
• 表格的结构标签可以省略
在这里插入图片描述

案例实操:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><table border="1"><caption><strong>学生成绩单<strong></caption><thead><tr><th>姓名</th><th>成绩</th><th>评语</th></tr></thead><tbody><tr><td>张三</td><td>100</td><td>真棒,第一名</td></tr><tr><td>李四</td><td>99</td><td>真棒,第二名</td></tr></tbody><tfoot><tr><td>总结</td><td>郎才女貌</td><td>真棒,相亲成功</td></tr></tfoot></table></body>
</html>

三、合并单元格

思路

场景:

将水平或垂直多个单元格合并成一个单元格
在这里插入图片描述

代码实现

在这里插入图片描述

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><table border="1"><caption><strong>学生成绩单<strong></caption><thead><tr><th>姓名</th><th>成绩</th><th>评语</th></tr></thead><tbody><tr><td>张三</td><td rowspan="2">100</td><td>真棒,第一名</td></tr><tr><td>李四</td><td>真棒,第二名</td></tr></tbody><tfoot><tr><td>总结</td><td colspan="2">郎才女貌</td></tr></tfoot></table></body>
</html>

在这里插入图片描述

在这里插入图片描述

相关文章:

HTML标签——表格标签

HTML标签——表格标签 目录HTML标签——表格标签一、表格标题和表头单元格标签场景&#xff1a;注意点&#xff1a;案例实操小结二、表格的结构标签场景&#xff1a;注意点&#xff1a;案例实操&#xff1a;三、合并单元格思路场景&#xff1a;代码实现一、表格标题和表头单元格…...

Telerik JustMock 2023 R1 Crack

Telerik JustMock 2023 R1 Crack 制作单元测试的最快、最灵活和模拟选项。 Telerik JustLock也很简单&#xff0c;可以使用一个模拟工具来帮助您更快地生成更好的单元测试。JustLock使您更容易创建对象并建立对依赖关系的期望&#xff0c;例如&#xff0c;互联网服务需求、数据…...

筑基八层 —— 问题思考分析并解决

目录 零&#xff1a;移步 一.修炼必备 二.问题思考&#xff08;先思考&#xff09; 三.问题解答 零&#xff1a;移步 CSDN由于我的排版不怎么好看&#xff0c;我的有道云笔记相当的美观&#xff0c;请移步有道云笔记 一.修炼必备 1.入门必备&#xff1a;VS2019社区版&#x…...

【面试题】当面试官问 Vue2与Vue3的区别,你该怎么回答?

大厂面试题分享 面试题库后端面试题库 &#xff08;面试必备&#xff09; 推荐&#xff1a;★★★★★地址&#xff1a;前端面试题库被问到 《vue2 与 vue3 的区别》应该怎么回答Vue 内部根据功能可以被分为三个大的模块&#xff1a;响应性 reactivite、运行时 runtime、编辑器…...

使用Python对excel中的数据进行处理

一、读取excel中的数据首先引入pandas库&#xff0c;没有的话使用控制台安装 —— pip install pandas 。import pandas as pd #引入pandas库&#xff0c;别名为pd#read_excel用于读取excel中的数据&#xff0c;这里只列举常用的两个参数&#xff08;文件所在路径&#xff…...

TCP协议原理三

文章目录七、延时应答八、捎带应答九、面向字节流粘包问题十、TCP异常情况总结七、延时应答 如果说滑动窗口的关键是让窗口大一些&#xff0c;传输速度就快一些。那么延时应答就是在接收方能够处理的前提下&#xff0c;尽可能把ack返回的窗口大小尽可能大一些。 如果在接受数据…...

mac在命令行里获取root权限

1、为什么要获取root权限&#xff1f; 答&#xff1a;一些命令在正常状态下没有权限会报错&#xff0c;只有获取了root权限才能正常操作。 比如我们想修改一些系统的文件&#xff1a; vim /etc/shells 1 修改后保存&#xff0c;发现没权限&#xff0c;报错了。如下图&#xf…...

文献阅读 Improving Seismic Data Resolution with Deep Generative Networks

题目 Improving Seismic Data Resolution with Deep Generative Networks 使用深度生成网络提高地震数据分辨率 摘要 叠前数据的使用&#xff0c;通常可以来解决噪声迹线、覆盖间隙或不规则/不适当的迹线间距等问题。但叠前数据并不总是可用的。作为替代方案&#xff0c;叠后…...

mysql数据库之子查询练习

1、查询员工的姓名、年龄、职位、部门信息&#xff08;隐式内连接&#xff09;。 #emp、dept #连接条件&#xff1a;emp.dept_iddept.id select e.name,e.age,e.job,d.name from emp e&#xff0c;dept d where e.dept_idd.id; 2、查询年龄小于30岁的员工姓名、年龄、职位、部…...

西电计算机通信与网络(计网)简答题计算题核心考点汇总(期末真题+核心考点)

文章目录前言一、简答计算题真题概览二、网桥&#xff0c;交换机和路由器三、ARQ协议四、曼彻斯特编码和差分曼彻斯特编码五、CRC六、ARP协议七、LAN相关协议计算前言 主要针对西安电子科技大学《计算机通信与网络》的核心考点进行汇总&#xff0c;包含总共26章的核心简答。 【…...

【博学谷学习记录】超强总结,用心分享丨人工智能 Python基础 个人学习总结之列表排序

目录前言简述list.sort()语法返回值实例无参参数key参数reversesorted()语法返回值实例无参参数key参数reverseoperator.itemgetter功能简述实例List.sort与sored区别sorted原理&#xff1a;Timsort算法扩展list原理数据结构心得前言 经过一周的学习&#xff0c;对Python基础部…...

深度讲解React Props

一、props的介绍 当React遇到的元素是用户自定义的组件&#xff0c;它会将JSX属性作为单个对象传递给该组件&#xff0c;这个对象称之为“props”。 函数声明的组件&#xff0c;会接受一个props形参&#xff0c;获取属性传递的参数 function ComponentA(props) { return <…...

WebRTC现状以及多人视频通话分析

1.WebRTC 概述WebRTC&#xff08;网页实时通信技术&#xff09;是一系列为了建立端到端文本或者随机数据的规范&#xff0c;标准&#xff0c;API和概念的统称。这些对等端通常是由两个浏览器组成&#xff0c;但是WebRTC也可以被用于在客户端和服务器之间建立通信连接&#xff0…...

【Windows】Windows下wget的安装与环境变量配置

1 wget安装 GNU Wget常用于使用命令行下载网络资源&#xff08;包括但不限于文件、网页等&#xff09;。 GNU Wget官网&#xff1a;GNU Wget GNU Wget for Windows&#xff1a;GNU Wget for Windows 安装时首先下载主安装包&#xff1a;Complete package, except sources&…...

密码学基础概念

把一段原始数据通过某种算法处理成另外一种数据&#xff08;原始数据为明文&#xff0c;处理后的数据为密文&#xff09;。明文->密文&#xff1a;称之为加密。密文->明文&#xff1a;称之为解密。 在加密过程中我们需要知道下面的这些概念&#xff1a; 1&#xff09;明文…...

科技巨头争相入局,卫星通信领域将迎来怎样的发展?

近年来&#xff0c;全球卫星通信产业进入了一个高速发展的阶段 与卫星通信相关的新技术和新应用不断出现&#xff0c;成为了媒体报道的热点&#xff0c;也引起了公众的广泛关注。 尤其是刚刚过去的2022年&#xff0c;华为和苹果公司分别发布了搭载卫星通信技术的手机&#xf…...

银行软件测试面试题目总结,希望可以帮到你

目录 一、根据题目要求写出具体LINUX操作命令 二、JMETER题目 三、根据题目要求写出具体SQL语句 总结感谢每一个认真阅读我文章的人&#xff01;&#xff01;&#xff01; 重点&#xff1a;配套学习资料和视频教学 一、根据题目要求写出具体LINUX操作命令 1、分别写出一种…...

MySQL数据定义

系列文章目录前言创建数据库删除数据库修改数据库修改表结构修改表中列修改表中约束创建表删除表前言 创建数据库 创建数据库CREATE DATABASE 数据库名 使用数据库use 数据库名; MySQL数据库如何建表 删除数据库 删除数据库语句DROP DATABASE 数据库名 这条语句会删除数据…...

跨设备文件传输工具横评

文章目录对比QQ微信SnapDropLocalSendIntelUnisonLANDropTailscaleAirDroidSendAnywhere参考文献对比 传输速度测试条件大致相同&#xff0c;文件大小约为 100 MB 工具优点缺点传输速度备注QQ支持断点续传不要求同一局域网需要安装1.81 MB/s微信方便需要安装不支持大文件传完还…...

Oracle通过SQL找出ID不连续的位置

文章目录1 前言2 SQL3 结语1 前言 工作中要求我找到 ID 不连续的地方, 然后拿这个 ID , 给数据库里面 INSERT 一条数据. 比如: ID备注… 省略连续的部分232425就是想找到这里断开的地方, 下一个可以 INSERT 的 ID 就是 2674915751157512075122… 省略连续的部分 2 SQL 假设数据…...

电脑插入多块移动硬盘后经常出现卡顿和蓝屏

当电脑在插入多块移动硬盘后频繁出现卡顿和蓝屏问题时&#xff0c;可能涉及硬件资源冲突、驱动兼容性、供电不足或系统设置等多方面原因。以下是逐步排查和解决方案&#xff1a; 1. 检查电源供电问题 问题原因&#xff1a;多块移动硬盘同时运行可能导致USB接口供电不足&#x…...

Java-41 深入浅出 Spring - 声明式事务的支持 事务配置 XML模式 XML+注解模式

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; &#x1f680; AI篇持续更新中&#xff01;&#xff08;长期更新&#xff09; 目前2025年06月05日更新到&#xff1a; AI炼丹日志-28 - Aud…...

JUC笔记(上)-复习 涉及死锁 volatile synchronized CAS 原子操作

一、上下文切换 即使单核CPU也可以进行多线程执行代码&#xff0c;CPU会给每个线程分配CPU时间片来实现这个机制。时间片非常短&#xff0c;所以CPU会不断地切换线程执行&#xff0c;从而让我们感觉多个线程是同时执行的。时间片一般是十几毫秒(ms)。通过时间片分配算法执行。…...

【C++从零实现Json-Rpc框架】第六弹 —— 服务端模块划分

一、项目背景回顾 前五弹完成了Json-Rpc协议解析、请求处理、客户端调用等基础模块搭建。 本弹重点聚焦于服务端的模块划分与架构设计&#xff0c;提升代码结构的可维护性与扩展性。 二、服务端模块设计目标 高内聚低耦合&#xff1a;各模块职责清晰&#xff0c;便于独立开发…...

Pinocchio 库详解及其在足式机器人上的应用

Pinocchio 库详解及其在足式机器人上的应用 Pinocchio (Pinocchio is not only a nose) 是一个开源的 C 库&#xff0c;专门用于快速计算机器人模型的正向运动学、逆向运动学、雅可比矩阵、动力学和动力学导数。它主要关注效率和准确性&#xff0c;并提供了一个通用的框架&…...

用机器学习破解新能源领域的“弃风”难题

音乐发烧友深有体会&#xff0c;玩音乐的本质就是玩电网。火电声音偏暖&#xff0c;水电偏冷&#xff0c;风电偏空旷。至于太阳能发的电&#xff0c;则略显朦胧和单薄。 不知你是否有感觉&#xff0c;近两年家里的音响声音越来越冷&#xff0c;听起来越来越单薄&#xff1f; —…...

解析奥地利 XARION激光超声检测系统:无膜光学麦克风 + 无耦合剂的技术协同优势及多元应用

在工业制造领域&#xff0c;无损检测&#xff08;NDT)的精度与效率直接影响产品质量与生产安全。奥地利 XARION开发的激光超声精密检测系统&#xff0c;以非接触式光学麦克风技术为核心&#xff0c;打破传统检测瓶颈&#xff0c;为半导体、航空航天、汽车制造等行业提供了高灵敏…...

Python 训练营打卡 Day 47

注意力热力图可视化 在day 46代码的基础上&#xff0c;对比不同卷积层热力图可视化的结果 import torch import torch.nn as nn import torch.optim as optim from torchvision import datasets, transforms from torch.utils.data import DataLoader import matplotlib.pypl…...

协议转换利器,profinet转ethercat网关的两大派系,各有千秋

随着工业以太网的发展&#xff0c;其高效、便捷、协议开放、易于冗余等诸多优点&#xff0c;被越来越多的工业现场所采用。西门子SIMATIC S7-1200/1500系列PLC集成有Profinet接口&#xff0c;具有实时性、开放性&#xff0c;使用TCP/IP和IT标准&#xff0c;符合基于工业以太网的…...

C# winform教程(二)----checkbox

一、作用 提供一个用户选择或者不选的状态&#xff0c;这是一个可以多选的控件。 二、属性 其实功能大差不差&#xff0c;除了特殊的几个外&#xff0c;与button基本相同&#xff0c;所有说几个独有的 checkbox属性 名称内容含义appearance控件外观可以变成按钮形状checkali…...