HTML(5)——列表表格

列表

无序列表

作用:布局排列整齐的不需要规定顺序的区域。

标签:ul嵌套il,ul是无序列表,li是列表条目

注:ul标签只能包裹li标签,li标签可以包含任何内容

有序列表

作用:布局排列整齐的需要规定顺序的区域。

标签:ol嵌套li,ol是有序列表。

注:ol标签只能包裹li标签,li标签里面可以包裹任何内容

定义列表

标签:dl嵌套dt和dd,dl是定义列表,dt是定义列表的标题,dd是定义列表的描述/详情

<dl>

  <dt>列表标题</dt>

  <dd>列表描述</dd>

  ......

</dl>

 注:dl里面只能包含dt和dd,dt和dd可以包含任何内容。

表格

标签:table嵌套tr,tr嵌套td、th。

标签名说明
table表格
tr
th表头单元格
td内容单元格

在网页中,表格默认没有边框线,使用border属性可以为表格添加边框线

表格结构标签

作用:用表格结构标签把内容划分区域,让表格结构更清晰。

标签名含义说明
thead表格头部表格头部内容
tbody表格主体主要内容区域
tfoot表格底部汇总信息区域

合并单元格

作用:将多个单元格合并成一个单元格,以合并同类信息。

合并单元格步骤:

  1.明确合并的目标

  2.跨行合并,保留最上单元格,添加属性rowspan

     跨列合并,保留最左单元格,添加属性colspan

  3.删除其他单元格

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

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

相关文章

基于大型语言模型的全双工语音对话方案

摘要解读 我们提出了一种能够以全双工方式运行的生成性对话系统&#xff0c;实现了无缝互动。该系统基于一个精心调整的大型语言模型&#xff08;LLM&#xff09;&#xff0c;使其能够感知模块、运动功能模块以及一个具有两种状态&#xff08;称为神经有限状态机&#xff0c;n…

监控易产品升级动态:V7.6.6.15版本全面升级

随着信息技术的不断发展&#xff0c;企业对系统监控和数据管理的需求日益增加。为了满足广大用户的实际需求&#xff0c;监控易团队经过不懈努力&#xff0c;成功推出了V7.6.6.15版本&#xff0c;对产品进行了全面升级和优化。本次升级不仅增强了产品的稳定性和可靠性&#xff…

Vue: Module “vue“ has no exported member xxx

这个问题让我困扰了好一会儿&#xff0c;我询问了 chatgpt 和各种网站社区&#xff0c;尝试了切换依赖的版本&#xff0c;清除缓存等等&#xff0c;依然没有解决 不过算是有心栽花花不开&#xff0c;无心插柳柳成荫&#xff0c;碰巧解决了&#xff0c;也不知道是不是这个原因&a…

Win11下安装VS2022失败的解决办法

前几天我把我的HP Z840的操作系统换成了Win11&#xff0c;在重装VS2022时遇到了麻烦&#xff0c;提示无法安装 Microsoft.VisualStudio.Devenv.Msi。 查看安装日志提示&#xff1a;Could not write value devenv.exe to key \SOFTWARE\Microsoft\Internet Explorer\Main\Featur…

getSelection限制选取范围

// 选择容器元素 const box document.queryselector(.box);// 监听选择事件 document.addEventListener(mouseup, (e) > {// 如果选择不在box内部&#xff0c;清除选择if (!box.contains(e.target)) {window.getSelection().removeAllRanges();} });// 监听键盘事件&#x…

Java的逻辑运算符

Java的逻辑与运算符&#xff1a; 符号 作用 说明 & 逻辑与&#xff08;且&#xff09; 并且&#xff0c;两边都为真&#xff0c;结果才是真 | 逻辑或 或者&#xff0c;两边都为假才是假 ^ 逻辑异或 …

轻松获取指定日期所在周的周一和周日

哈喽&#xff0c;大家好呀&#xff0c;好久不见&#xff01;今天是一篇浅记。根据传入日期自动获取所在周一和周日… 正常基操方法&#xff0c;根据传入日期自动获取所在周一和周日。注意传入日期是周日的情况哈&#xff0c;需要往前推7天才是周一。 楼主方法中已处理&#xf…

在 Clojure 中,如何实现高效的并发编程以处理大规模数据处理任务?

在Clojure中&#xff0c;可以使用以下几种方式来实现高效的并发编程以处理大规模数据处理任务&#xff1a; 并发集合&#xff08;Concurrent Collections&#xff09;&#xff1a;Clojure提供了一些并发集合数据结构&#xff0c;如ref、agent和atom&#xff0c;它们能够在多个线…

57.SAP MII产品介绍(07)功能详解(06)Workbench-SQLQuery

1.SQLQuery概念 您可以使用SAP Manufacturing Integration and Intelligence&#xff08;SAP MII&#xff09;Workbench中的SQLQuery来创建访问面向SQL的连接器&#xff08;如IDBC连接器&#xff09;的模板。此查询的扩展名为tqsq。 简而言之&#xff0c;SQLQuery就是一段…

计算机系统基础实训七-MallocLab实验

实验目的与要求 1、让学生理解动态内存分配的工作原理&#xff1b; 2、让学生应用指针、系统级编程的相关知识&#xff1b; 3、让学生应用各种动态内存分配器的实现方法&#xff1b; 实验原理与内容 &#xff08;1&#xff09;动态内存分配器基本原理 动态内存分配器维护…

细说MCU的ADC模块单通道单次采样的实现方法

目录 一、工程依赖的硬件 二、设计目的 三、建立工程 1、配置GPIO 2、配置中断 3、配置串口 4、配置ADC 5、选择时钟源和Debug 6、配置系统时钟和ADC时钟 四、设置采样频率 五、代码修改 1、重定义外部中断回调函数 2、启动ADC 3、配置printf函数 六、运行并…

mysql5.7windows安装修改密码

mysql5.7windows安装修改密码 1.首先下载Windows 64位安装包2.安装服务3.my.ini4.初始化4.做成Windows服务5.重置密码 1.首先下载Windows 64位安装包 2.安装服务 双击运行安装服务&#xff0c;一直next&#xff1b; 在Choose Setup Type界面中 选择Custom选项&#xff0c;意思…

【thinkphp问题栏】tp5.0分页技巧

一、调用内置方法paginate thinkphp内置了一个paginate方法支持分页功能 该方法位于library\think\db\Query.php内 /*** 分页查询* param int|array $listRows 每页数量 数组表示配置参数* param int|bool $simple 是否简洁模式或者总记录数* param array $config 配…

头歌资源库(14)残缺棋盘

一、 问题描述 二、算法思想 首先&#xff0c;将2^k 2^k的棋盘划分为四个相等大小的子棋盘&#xff0c;定义为左上、左下、右上和右下四个子棋盘。 然后&#xff0c;根据残缺格的坐标&#xff0c;确定其中一个子棋盘是不完整的&#xff0c;即残缺子棋盘。假设残缺子棋盘是左…

TOP命令参数

top命令是Linux和类Unix系统中一个非常强大的系统监控工具&#xff0c;用于实时查看系统中各个进程的资源使用情况。它可以显示CPU使用率、内存使用情况、进程PID、进程运行时间等重要信息。top命令支持多种参数和交互式命令&#xff0c;以下是主要参数及其含义&#xff1a; t…

新火种AI|Claude 3.5一夜封王超越GPT-4o!留给OpenAI的时间真的不多了...

AI大模型更新换代的速度&#xff0c;的确快到令人难以想象。 相信很多人现在对“最先进AI大模型”的印象还停留在GPT-4&#xff0c;但事实上&#xff0c;大模型领域的头把交椅早已悄然易主了好几回。就在GPT-4惊艳全球不久之后&#xff0c;其“死对头” Anthropic发布了Claude…

“循环购“:快消品行业的创新商业模式引领者

大家好&#xff0c;我是吴军&#xff0c;来自一家在软件开发与商业模式创新领域享有盛誉的公司。我们专注于为企业提供全方位的商城系统搭建及商业模式定制服务。迄今为止&#xff0c;我们已经成功地为众多企业打造了超过200种独特的商业模式&#xff0c;助力他们实现了显著的商…

如果你死了,你的代码怎么代替你继续存在下去

问你个问题&#xff0c;如果你写的程序代码特别耐用&#xff0c;特别引人注目&#xff0c;几乎全世界的人在用。那么问你个比较丧的问题&#xff0c;有一天你死了&#xff0c;你怎么维护你的程序代码呢&#xff1f; 你可能听说过这个人&#xff1a;Philip Hazel 。他在剑桥大学…

【Web3初识系列】如何连接 Binance Smart Chain通过交易对绘制 k 线?

连接 Binance Smart Chain通过交易对绘制 k 线 安装 web3 pip install web3连接到 Binance Smart Chain 使用公共的 BSC 节点 URL。 from web3 import Web3# 连接到 BSC 公共节点 bsc_url "https://bsc-dataseed.binance.org/" web3 Web3(Web3.HTTPProvider(bs…

【PL理论】(26) 内存管理:C语言实现内存管理的方式 | 栈帧的分配和释放 | C/C++ 手动内存管理

&#x1f4ad; 写在前面&#xff1a;在前面的章节中&#xff0c;语言的语义只分配了新的内存位置&#xff0c;我们没有讨论内存位置的释放。在实际的语言中&#xff0c;内存位置在执行过程中会被不断地分配和释放。下面的章节&#xff0c;我们将讨论编程语言的这种内存管理&…