当前位置： 首页 > article >正文

HTML----列表与表格

article 2026/4/15 8:03:32
一、列表标签1.ul:无序列表标签用来放没有先后顺序的并列内容2.ol:有序列表标签用来存放有明确先后顺序的步骤内容3.li:列表项不管是ul还是ol里面都只能放.li不能直接写文字用来放每一条具体内容用商城支付举例代码如下所示!DOCTYPE html html langen head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 title无序列表和有序列表实验/title /head body ul li 支付方式 ol li到账付款/li li财付通/li li支付宝/li li网银在线/li /ol /li li 网银在线支付步骤 ol li选择您要是用的网上银行/li li显示您的应付总价点击“确认无误付款/li li确定您在银行的预留信息点击确定/li li输入您的网银账号、登录密码、验证码/li li支付成功提示“已完成付款”/li /ol /li /ul /body /html这里可以看到ul管并列分类ol管顺序步骤li管内容承载。举个简单易懂的例子比如一本书的目录ul是大章节ol是章节下的小节li是每一个标题。运行结果如下图所示二、表格与合并单元格我们先来认识一下表格的基本标签吧。table:用来定义整个表格是表格的容器tr:用来定义表格的一行th:用来定义表头单元格td:用来定义普通的单元格我们来看下创建表格的代码!DOCTYPE html html langen head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 title表格实验/title /head body h2创建表格练习/h2 table border1 width400rpx height200rpx tr th年份/th th教师人数/th th学生人数/th th总人数/th /tr tr td2021年/td td120/td td1800/td td1920/td /tr tr td2022年/td td125/td td1850/td td1975/td /tr tr td2023年/td td 130/td td1900/td td2030/td /tr tr td2024年/td td 135/td td1950/td td2085/td /tr /table /body /html也许有的同学会问为什么写了表格浏览器却看不见那是因为HTML的table标签默认是无边框、无背景、无间距的透明结构浏览器只会渲染表格里的文字内容不会给表格加上边框解决方法也很简单我们只需要给table标签加上border“1”属性就可以啦当然我们也可以给表格设置宽和高。运行结果如下图所示接下来我们来看看单元格是怎么合并的吧。在HTML中合并单元格全靠colspan和rowspan这两个属性colspan把同一行的多个单元格合并成一个大单元格rowspan把同一列的多个单元格合并成一个大单元格代码如下所示!DOCTYPE html html langen head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 title表格实验/title /head body h2合并单元格练习/h2 table border1 width400rpx height200rpx tr th年份/th th教师人数/th th学生人数/th th总人数/th /tr tr td2021年/td td colspan2/td td rowspan2/td /tr tr td2022年/td td/td td/td /tr tr td2023年/td td colspan2 rowspan2/td td/td /tr tr td2024年/td td/td /tr /table /body /html运行结果如下图所示

相关文章：

HTML----列表与表格

一、列表标签1.<ul>:无序列表标签&#xff0c;用来放没有先后顺序的并列内容2.<ol>:有序列表标签&#xff0c;用来存放有明确先后顺序的步骤内容3.<li>:列表项&#xff0c;不管是<ul>还是<ol>里面都只能放.<li>&#xff0c;不能直接写文字…...

编程日记 2026/4/15 8:03:32

ffmpeg的安装与配置

一、ffmpeg简介FFmpeg 是一套开源、免费且功能极其强大的跨平台音视频处理框架&#xff0c;在业界被广泛誉为“音视频处理的瑞士军刀”。无论你是想进行简单的格式转换&#xff0c;还是开发复杂的流媒体服务&#xff0c;FFmpeg 都是目前最核心的底层工具。以下是关于它的核心简…...

编程日记 2026/4/15 8:03:32

毕业设计实战-PyQt5-YOLOv8-鱼类尺寸智能测量系统，融合OpenCV图像处理与Modbus工业通信

1. 项目背景与应用场景 水产养殖行业一直面临着鱼类生长监测的难题。传统的人工测量方法不仅效率低下&#xff0c;而且容易对鱼群造成应激反应。我在参与某大型养殖场智能化改造项目时&#xff0c;就亲眼见过工人需要每天抽样捞鱼测量的场景——既费时费力&#xff0c;测量数据…...

编程日记 2026/4/15 8:01:31

工业AI实战：如何用Python+UNet打造轨道缺陷智能检测系统

工业AI实战&#xff1a;PythonUNet构建高精度轨道缺陷检测系统 在轨道交通运维领域&#xff0c;肉眼检测钢轨表面缺陷的传统方式正被AI技术革新。这套基于UNet的智能检测系统&#xff0c;能在毫秒级完成裂缝、剥落等缺陷的定位与分类&#xff0c;准确率超越人工检测3倍以上。我…...

编程日记 2026/4/15 8:01:31

如何高效使用智能清理工具：Windows Cleaner完整操作指南

如何高效使用智能清理工具&#xff1a;Windows Cleaner完整操作指南 【免费下载链接】WindowsCleaner Windows Cleaner——专治C盘爆红及各种不服&#xff01; 项目地址: https://gitcode.com/gh_mirrors/wi/WindowsCleaner 还在为电脑C盘爆红而焦虑吗&#xff1f;Windo…...

编程日记 2026/4/15 8:01:31

3步解锁网易云加密音乐：ncmdump实战解密指南

3步解锁网易云加密音乐&#xff1a;ncmdump实战解密指南 【免费下载链接】ncmdump 项目地址: https://gitcode.com/gh_mirrors/ncmd/ncmdump 还在为网易云音乐下载的歌曲只能在特定客户端播放而烦恼吗&#xff1f;当你想要在车载音响、专业音频软件或跨设备上欣赏音乐时…...

编程日记 2026/4/15 8:01:31

RAG系统必看！混合检索、关键词、语义一次讲清，生产级方案选型指南

本文深入探讨了RAG系统中检索层的核心重要性&#xff0c;对比了语义检索、关键词检索和混合检索三种方式的特点与适用场景。指出单一检索方式存在致命盲区&#xff0c;生产级RAG必须采用混合检索。文章详细解析了关键词检索的两种技术路线&#xff08;稀疏向量和全文索引&#…...

编程日记 2026/4/15 8:01:31

三月七小助手：5步掌握崩坏星穹铁道全自动游戏助手终极指南

三月七小助手&#xff1a;5步掌握崩坏星穹铁道全自动游戏助手终极指南 【免费下载链接】March7thAssistant 崩坏&#xff1a;星穹铁道全自动 三月七小助手 项目地址: https://gitcode.com/gh_mirrors/ma/March7thAssistant 你是否厌倦了每天重复的清体力、做日常、领奖励…...

编程日记 2026/4/15 7:59:30

彻底禁用Windows安全警告弹窗：组策略与命令行的终极指南

1. 为什么Windows总弹出安全警告&#xff1f; 每次双击下载的exe文件时&#xff0c;那个黄底黑字的警告框就像个尽职的保安&#xff0c;非要问你"确定要开门吗&#xff1f;"。我帮客户维护服务器时&#xff0c;发现这个设计本意是好的——防止恶意脚本自动运行。但当…...

编程日记 2026/4/15 7:59:30

湿敏电阻HR202的两种驱动方案实测：IO充放电法 vs. 交流方波AD采样，哪个更适合你的项目？

湿敏电阻HR202驱动方案深度评测&#xff1a;IO充放电法与交流方波AD采样的实战抉择 在物联网设备与智能家居快速普及的今天&#xff0c;环境湿度监测已成为许多项目的标配功能。面对市场上动辄数十元的数字式温湿度模块&#xff0c;越来越多的工程师开始关注成本仅需几元钱的湿…...

编程日记 2026/4/15 7:59:30

实战指南（一）易语言与大漠插件：从零打造自动化脚本的避坑手册

1. 易语言与大漠插件入门指南 第一次接触易语言和大漠插件时&#xff0c;我完全被它们的强大功能震撼到了。易语言作为一款中文编程工具&#xff0c;对新手特别友好&#xff0c;而大漠插件则是自动化脚本开发的利器。记得刚开始学习时&#xff0c;我花了一整天时间才成功调通第…...

编程日记 2026/4/15 7:59:30

蓝牙耳机连接背后的秘密：SDP协议在A2DP配对中的关键作用

蓝牙耳机连接背后的秘密&#xff1a;SDP协议在A2DP配对中的关键作用 每次打开蓝牙耳机&#xff0c;手机总能自动识别并恢复上次的音量设置和播放控制——这种无缝体验背后&#xff0c;隐藏着一套精妙的协议对话机制。就像餐厅老顾客无需重复点单&#xff0c;蓝牙设备间的"…...

编程日记 2026/4/15 7:59:26

SVG、XML 及其生态技术全景指南：从基础规范到工程实践

XML&#xff08;Extensible Markup Language&#xff09;并非单一工具&#xff0c;而是一套可扩展的元语言规范&#xff0c;其核心价值在于定义结构化数据的语法框架。 基于 XML 的各类应用标准&#xff08;XML-based applications&#xff09;在 Web、出版、科学计算、工业控…...

编程日记 2026/4/15 7:57:26

从GKCTF 2021 CheckBot看CSRF攻击的实战应用

1. CSRF攻击初探&#xff1a;从CheckBot题目说起 第一次看到GKCTF 2021的CheckBot题目时&#xff0c;我眼前一亮——这简直是个教科书级的CSRF实战案例。题目设计得很巧妙&#xff1a;你需要让一个自动化的bot&#xff08;可以理解为模拟管理员行为的程序&#xff09;点击你构造…...

编程日记 2026/4/15 7:57:26

利用Kali与Seeker实现位置追踪：技术原理与防范策略

1. Kali与Seeker位置追踪技术揭秘 你可能听说过黑客能通过一个链接获取你的精确位置&#xff0c;听起来像电影情节对吧&#xff1f;但实际上&#xff0c;这种技术门槛比想象中低得多。我去年在安全测试中就曾用Kali Linux配合Seeker工具&#xff0c;成功复现了这种位置追踪攻击…...

编程日记 2026/4/15 7:57:26

免费获取米哈游游戏字体：11款架空文字完整安装指南

免费获取米哈游游戏字体&#xff1a;11款架空文字完整安装指南 【免费下载链接】HoYo-Glyphs Constructed scripts by HoYoverse 米哈游的架空文字 项目地址: https://gitcode.com/gh_mirrors/ho/HoYo-Glyphs 想要为你的设计作品注入米哈游游戏的独特魅力吗&#xff1f;…...

编程日记 2026/4/15 7:57:26

基于springboot乡镇卫生所医用物资进销存系统设计与实现_qn3ueh40

前言 乡镇卫生所作为基层医疗服务机构&#xff0c;承担着为当地居民提供基本医疗服务和公共卫生服务的重要职责。然而&#xff0c;由于资源有限、管理手段落后等原因&#xff0c;乡镇卫生所在医用物资管理方面普遍存在库存不准确、采购不及时、物资浪费或短缺等问题。基于Sprin…...

编程日记 2026/4/15 7:57:26

终极指南：3步轻松解锁网易云音乐加密文件，让音乐随处播放

终极指南&#xff1a;3步轻松解锁网易云音乐加密文件&#xff0c;让音乐随处播放 【免费下载链接】ncmdump 项目地址: https://gitcode.com/gh_mirrors/ncmd/ncmdump 你是否曾经遇到过这样的尴尬时刻&#xff1f;精心收藏的网易云音乐歌曲&#xff0c;想在车载音响上播…...

编程日记 2026/4/15 7:55:26

像素史诗·智识终端软件测试面试题分析与用例设计生成

像素史诗智识终端软件测试面试题分析与用例设计生成 1. 测试工程师的痛点与解决方案 在软件测试工程师的日常工作中&#xff0c;面试准备和测试用例设计是两大核心挑战。很多测试工程师都遇到过这样的困境&#xff1a;面对五花八门的面试题不知如何系统准备&#xff0c;或者面…...

编程日记 2026/4/15 7:55:26

终极Windows系统清理指南：如何用WindowsCleaner快速拯救你的C盘空间

终极Windows系统清理指南&#xff1a;如何用WindowsCleaner快速拯救你的C盘空间 【免费下载链接】WindowsCleaner Windows Cleaner——专治C盘爆红及各种不服&#xff01; 项目地址: https://gitcode.com/gh_mirrors/wi/WindowsCleaner 你是否经常遇到Windows电脑运行越…...

编程日记 2026/4/15 7:55:26

STC32G/AI8051U的GPIO中断库函数实战：从手册警告到实际可用的完整配置流程

STC32G/AI8051U的GPIO中断库函数实战&#xff1a;从手册警告到实际可用的完整配置流程 当STC32G12K128开发板上的LED灯随着按键触发精准闪烁时&#xff0c;我盯着示波器上清晰的下降沿波形&#xff0c;不禁对官方手册中"暂不要使用上升/下降沿中断模式"的警告产生了疑…...

编程日记 2026/4/15 7:55:26

Phi-4-mini-reasoning应用场景：芯片设计验证中的布尔逻辑表达式求值

Phi-4-mini-reasoning在芯片设计验证中的布尔逻辑表达式求值应用 1. 芯片设计验证的挑战 芯片设计验证是半导体行业中最耗时且关键的环节之一。在这个阶段&#xff0c;工程师需要验证设计的逻辑电路是否满足预期功能&#xff0c;而布尔逻辑表达式求值正是这一过程的核心组成部…...

编程日记 2026/4/15 7:55:26

网络协议：BFD

文章目录 BFD RFC 7419 开源软件 omni switch vpp keepalived openswitch BFD 自从我接手一个网络项目，从2018年开始做BFD，一直到2026年，还没有完成，现在看项目计划BFD的开发都要拖到2028年了。一个主要的原因是需求没有这么强烈，原来的网络检测方法以及够用，满足需求。…...

编程日记 2026/4/15 7:53:26

DeepSeek-R1-Distill-Llama-8B实操指南：Ollama模型权重路径修改与自定义加载

DeepSeek-R1-Distill-Llama-8B实操指南&#xff1a;Ollama模型权重路径修改与自定义加载 1. 认识DeepSeek-R1-Distill-Llama-8B推理模型 DeepSeek-R1系列是专门针对推理任务优化的新一代模型&#xff0c;其中DeepSeek-R1-Distill-Llama-8B是基于Llama架构的蒸馏版本。这个8B参…...

编程日记 2026/4/15 7:53:26

从3000到20万，普源、鼎阳、泰克示波器怎么选？一份给嵌入式开发者的‘够用就好’选购指南

从3000到20万&#xff1a;嵌入式开发者示波器选购实战指南 当你面对一个SPI通信异常需要抓取波形时&#xff0c;或是调试I2C总线上的数据错乱时&#xff0c;一台合适的示波器就是你的"第三只眼"。但打开购物网站&#xff0c;从3000元的国产入门款到20万元的进口旗舰&…...

编程日记 2026/4/15 7:53:26

建模比赛代码集合

目录 0 环境配置与检查 1 数据预处理 1.1 数据清洗 1.2 编码转换 1.3 特征工程 1.4 基础的数据处理&#xff08;代码-python&#xff09; 2 离散连续\分类预测算法 2.1 离散\分类算法 2.2 连续\预测算法 3 有无监督 3.1 有监督学习 3.2 无监督学习 4 神经网络 5 …...

编程日记 2026/4/15 7:53:26

EVA-01企业微信机器人实战：5步打造移动端图片分析助手

EVA-01企业微信机器人实战&#xff1a;5步打造移动端图片分析助手 1. 项目背景与价值 在移动办公场景中&#xff0c;我们经常遇到需要快速分析图片内容的场景&#xff1a;工厂设备巡检、产品设计评审、文档信息提取等。传统方式需要将图片传输到电脑端&#xff0c;再通过专业…...

编程日记 2026/4/15 7:53:26

Local SDXL-Turbo实操手册：从键盘输入到画面生成的完整链路

Local SDXL-Turbo实操手册&#xff1a;从键盘输入到画面生成的完整链路 1. 什么是Local SDXL-Turbo&#xff1f; Local SDXL-Turbo是一个基于StabilityAI SDXL-Turbo构建的实时绘画工具。与传统的AI绘画工具需要等待几分钟生成不同&#xff0c;这个工具实现了真正的"打字…...

编程日记 2026/4/15 7:51:25

LangChain4j实战：手把手教你用Tools工具解决大模型“幻觉”，让AI准确获取当前日期和实时数据

LangChain4j实战&#xff1a;用Tools工具消除大模型“幻觉”&#xff0c;实现精准数据获取 最近在开发一个需要集成大语言模型的Java应用时&#xff0c;遇到了一个棘手的问题&#xff1a;当用户询问"今天几号"或"某股票最新价格"时&#xff0c;模型给出的答…...

编程日记 2026/4/15 7:51:25

终极免费解决方案：RDPWrap实现Windows远程桌面多用户连接完整指南

终极免费解决方案&#xff1a;RDPWrap实现Windows远程桌面多用户连接完整指南 【免费下载链接】rdpwrap RDP Wrapper Library 项目地址: https://gitcode.com/gh_mirrors/rd/rdpwrap 你是否曾经因为Windows远程桌面只能单用户连接而感到困扰&#xff1f;是否希望家庭多设…...

编程日记 2026/4/15 7:51:25