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

✨2.快速了解HTML5的标签类型

article 2026/4/17 21:27:51

 

✨✨HTML5 的标签类型丰富多样，每种类型都有其独特的功能和用途，以下是一些常见的 HTML5 标签类型介绍：

🦋结构标签

  • 🪭<html>：它是 HTML 文档的根标签，所有其他标签都包含在这个标签内，就像一个大容器，把整个网页的内容都包裹起来。
  • 🪭<head>：这个标签里包含的是关于网页的元信息，比如网页的标题、引入的外部样式表、脚本等，这些信息不会直接显示在网页页面上，但对网页的显示和功能起着重要的作用。
  • 🪭<body>：网页中实际显示的内容都放在<body>标签里，比如文字、图片、按钮等所有能被用户看到的元素都在这个标签内部。
  • 🪭<header>：通常用来表示网页或页面中某个区域的头部部分，比如网站的 logo、导航栏等内容可以放在<header>标签里。
  • 🪭<footer>：与<header>相对，用于表示网页或页面中某个区域的底部部分，一般包含版权信息、联系方式等内容。

🦋文本标签

  • 🪭<h1> - <h6>：这是标题标签，<h1>是最大的标题，<h6>是最小的标题。它们用于突出显示网页中的不同级别标题，使内容结构更清晰，便于用户快速了解网页的主要内容。
  • 🪭<p>：段落标签，用于定义文本段落。只要是一段连续的文本，就可以把它放在<p>标签里，浏览器会自动在段落之间添加一些间距，使文本看起来更有条理。
  • 🪭<span>：它是一个行内标签，主要用于在不改变文本结构的情况下，对部分文本进行样式设置或添加脚本行为。比如你想给一段文字中的某个词设置特殊颜色，就可以把这个词放在<span>标签里，然后对<span>标签设置样式。
  • 🪭<em>：用于强调文本，通常会以斜体的形式显示。比如你想突出某个重要的词语或句子，就可以把它放在<em>标签里。
  • 🪭<strong>：也是用于强调文本，但它的强调程度比<em>更强，一般会以粗体的形式显示。

🦋多媒体标签

  • 🪭<img>：用于在网页中插入图片。通过设置src属性来指定图片的路径，alt属性来提供图片的描述信息，当图片无法显示时，就会显示alt属性中的文字。
  • 🪭<audio>：用于在网页中嵌入音频文件，支持多种音频格式。可以通过src属性指定音频文件的路径，还可以设置controls属性来显示音频播放控制按钮，让用户能够播放、暂停、调节音量等。
  • 🪭<video>：用来在网页中播放视频，同样支持多种视频格式。通过src属性指定视频文件的路径，controls属性来显示视频播放控制栏，还可以设置width和height属性来指定视频的宽度和高度。

🦋表单标签

  • 🪭<form>：表单标签，用于创建用户输入信息的表单。它可以包含各种表单元素，如文本输入框、下拉菜单、单选按钮、复选框等，用户在表单中输入的信息可以提交到服务器进行处理。
  • 🪭<input>：这是最常用的表单元素之一，它可以根据不同的type属性值创建不同类型的输入框，比如type="text"创建文本输入框，type="password"创建密码输入框，type="checkbox"创建复选框，type="radio"创建单选按钮等。
  • 🪭<select>：用于创建下拉菜单，用户可以从下拉列表中选择一个选项。在<select>标签内部，通过<option>标签来定义下拉菜单中的每个选项。
  • 🪭<textarea>：用于创建多行文本输入框，用户可以在其中输入大量的文本内容，比如留言、评论等。

🦋布局标签

  • 🪭<div>：这是一个非常常用的布局标签，它就像一个容器，可以把网页中的不同部分划分成不同的区域，然后通过 CSS 样式来对这些区域进行布局和样式设置。
  • 🪭<ul> 和 <li>：<ul>是无序列表标签，<li>是列表项标签，它们通常一起使用来创建无序列表，比如项目符号列表。每个<li>标签代表列表中的一个项目。
  • 🪭<ol> 和 <li>：<ol>是有序列表标签，和<ul>类似，但它创建的是有序列表，比如数字编号列表。<li>同样用于定义列表中的每个项目。

 

相关文章：

✨2.快速了解HTML5的标签类型

✨✨HTML5 的标签类型丰富多样&#xff0c;每种类型都有其独特的功能和用途&#xff0c;以下是一些常见的 HTML5 标签类型介绍&#xff1a; &#x1f98b;结构标签 &#x1faad;<html>&#xff1a;它是 HTML 文档的根标签&#xff0c;所有其他标签都包含在这个标签内&am…...

编程日记 2026/4/13 12:51:20

力扣 买卖股票的最佳时机

贪心算法典型例题。 题目 做过股票交易的都知道&#xff0c;想获取最大利润&#xff0c;就得从最低点买入&#xff0c;最高点卖出。这题刚好可以用暴力&#xff0c;一个数组中找到最大的数跟最小的数&#xff0c;然后注意一下最小的数在最大的数前面即可。从一个数组中选两个数…...

编程日记 2026/4/13 13:03:06

【SQL】SQL多表查询

&#x1f384;概念 一般我们说的多表查询都涉及外键和父子表之间的关系。比如一对多:一般前面指的是父表后面指的是子表。 ⭐分类 一对多(多对一) 多对多 一对一 ⭐一对多 &#x1f4e2;案例&#xff1a;部门与员工的关系 &#x1f4e2;关系&#xff1a;一个部门对应多个员…...

编程日记 2026/4/10 5:42:13

HTML之JavaScript DOM（document）编程处理事件

HTML之JavaScript DOM&#xff08;document&#xff09;编程处理事件 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"…...

编程日记 2026/2/27 17:21:40

知识篇 | DeepSeek企业部署模式主要有6种

国际数据公司IDC近日发文《DeepSeek爆火的背后&#xff0c;大模型/生成式AI市场生态潜在影响引人关注》表示&#xff1a; “大模型的部署过程需同时满足高并发与低延迟的严苛要求&#xff0c;并需全面考量数据安全、隐私保障、资源弹性扩展以及系统维护等多重因素&#xff0c;D…...

编程日记 2026/4/6 11:37:00

uniapp中@input输入事件在修改值只有第一次有效的问题解决

在uniapp中使用输入框&#xff0c;要求输入不超过7个字&#xff0c;所以需要监听输入事件&#xff0c;当每次输入文字的时候&#xff0c;就把输入的值截断&#xff0c;取前7个值。但是在input事件中&#xff0c;重新赋值的值发生了变化&#xff0c;但是页面上的还是没有变&…...

编程日记 2026/4/13 9:12:47

linux环境-nginx通过nginx_upstream_check_module模块，配置服务自动检测-日志自动分割

依赖包正在审核中，通过后将在文章顶部展示，如再次编辑请到内容管理-下载类目 cd nginx源码目录（nginx-1.27.3） 在源码目录下执行一下操作，完成nginx安装和启动 1、双击执行gccCheck.sh，安装gcc化境 脚本内容如下 #!/bin/bash # 检查GCC是否安装 if ! gcc --vers…...

编程日记 2026/4/2 15:25:50

AI 百炼成神：线性回归，预测房价

我们开始第一个项目——线性回归：预测房价。这是一个经典的机器学习入门项目，可以帮助你理解如何使用线性回归模型来预测连续的数值。 第一个项目：线性回归预测房价 项目目标 学习线性回归的基本概念。使用历史房价数据建立一个预测模型。理解如何评估模型的性能。项目步骤…...

编程日记 2026/3/26 17:22:12

Linux运维篇-存储基础知识

什么是存储 用于存放数据信息的设备和介质&#xff0c;等同于计算机系统中的外部存储&#xff0c;是一个完整的系统。 存储的结构和趋势 存储的体系结构 当前存储的主要体系结构有三种&#xff1a; DASNASSAN 存储的发展趋势 ssd固态硬盘云存储一体化应用存储设备非结构…...

编程日记 2026/4/16 12:01:16

Pytorch实现论文之三元DCGAN生成RGB图像用于红外图像着色生成

简介 简介：采用了三次DCGAN单独生成单通道图像之后进行组成RGB图像放入鉴别器中检测，并在鉴别器和生成器的损失训练中采用梯度方法来提升或者降低权重。该方法将用于获得红外图像着色的生成。 论文题目：Infrared Image Colorization based on a Triplet DCGAN Architectur…...

编程日记 2026/3/20 2:42:34

Socket通讯协议理解及客户端服务器程序流程

Socket通讯我们可以从以下几个方面简单理解 1.Socket是网络通信中的一项重要技术&#xff0c;它提供了在网络上进行数据交换的接口。用C#、Java、C等开发语言&#xff0c;都可以开发Socket网络通信程序。 2.Socket(套接字)是计算机网络编程中的一种抽象&#xff0c;它允许不同…...

编程日记 2026/4/15 14:16:28

ceph部署-14版本（nautilus）-使用ceph-ansible部署实验记录

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、环境信息二、部署步骤2.1 基础环境准备2.2 各节点docker环境安装2.3 搭建互信集群2.4 下载ceph-ansible 三、配置部署文件3.1 使用本地docker3.2 配置hosts…...

编程日记 2026/4/14 8:32:30

vue3 + thinkphp 接入 七牛云 DeepSeek-R1/V3 流式调用和非流式调用

如何获取七牛云 Token API 密钥 https://eastern-squash-d44.notion.site/Token-API-1932c3f43aee80fa8bfafeb25f1163d8 后端 // 七牛云 DeepSeek API 地址private $deepseekUrl https://api.qnaigc.com/v1/chat/completions;private $deepseekKey 秘钥;// 流式调用public f…...

编程日记 2026/4/2 23:25:27

vlanif接口转发vlan

一.为什么需要VLAN 1.1 什么是VLAN&#xff1f; VLAN&#xff08;Virtual LAN&#xff09;&#xff0c;翻译成中文是“虚拟局域网”。LAN可以是由少数几台家用计算机构成的网络&#xff0c;也可以是数以百计的计算机构成的企业网络。VLAN所指的LAN特指使用路由器分割的网络——…...

编程日记 2026/4/3 2:58:15

Rook-ceph(1.92最新版)

安装前准备 #确认安装lvm2 yum install lvm2 -y #启用rbd模块 modprobe rbd cat > /etc/rc.sysinit << EOF #!/bin/bash for file in /etc/sysconfig/modules/*.modules do[ -x \$file ] && \$file done EOF cat > /etc/sysconfig/modules/rbd.modules &l…...

编程日记 2026/4/13 19:28:38

第2章 信息技术发展（一）

2.1 信息技术及其发展 2.1.1 计算机软硬件 计算机硬件(Computer Hardware)是指计算机系统中由电子、机械和光电元件等组成的各种物理装置的总称。 计算机软件 (Computer Software)是指计算机系统中的程序及其文档&#xff0c;程序是计算任务的处理对象和处理规则的描述; 文档…...

编程日记 2026/4/13 9:19:33

python学习笔记，python处理 Excel、Word、PPT 以及邮件自动化办公

文章目录 前言一、环境搭建1. 下载 Python2. 安装 Python 二、处理 Excel 文件&#xff08;openpyxl库&#xff09;三、 处理 Word 文件&#xff08;python-docx库&#xff09;四、 处理 PPT 文件&#xff08;python-pptx库&#xff09;五、 自动发送邮件&#xff08;smtplib和…...

编程日记 2026/3/1 10:09:47

【网络基本知识--2】

网络基本知识--2 1.主机A和主机B通过三次握手TCP连接&#xff0c;过程是&#xff1a; TCP三次握手连接过程如下&#xff1a; 1.客户端发送SYN(SEQx)报文发送给服务器端&#xff0c;进入SYN_SEND状态&#xff1b; 2.服务器端收到SYN报文&#xff0c;回应一个SYN(SEQy)ACK(ACKx1)…...

编程日记 2026/4/14 6:08:56

MoE硬件部署

文章目录 MoE硬件部署硬件需求**专家硬件映射&#xff1a;模块化计算单元****路由硬件加速&#xff1a;门控网络专用单元****内存与通信优化****能效控制策略****实例&#xff1a;假设部署Mixtral 8x7B到自研AI芯片** 资源分配硬件资源预分配&#xff08;编译时&#xff09;运行…...

编程日记 2026/3/7 22:07:50

摄影——曝光三要素

曝光三要素 光圈&#xff08;F&#xff09;&#xff1a;控制进光量的装置快门&#xff08;1/X&#xff09;&#xff1a;接受光线的时间感光度&#xff08;ISO&#xff09;&#xff1a;感光器件对光线的敏感程度 一、快门&#xff08;1/X&#xff09; 静物 1/125 动物 1/500 …...

编程日记 2026/4/15 11:59:51

DeepSeek-R1论文阅读及蒸馏模型部署

DeepSeek-R1论文阅读及蒸馏模型部署 文章目录 DeepSeek-R1论文阅读及蒸馏模型部署摘要Abstract一、DeepSeek-R1论文1. 论文摘要2. 引言3. DeepSeek-R1-Zero的方法3.1 强化学习算法3.2 奖励建模3.3 训练模版3.4 DeepSeek-R1-Zero的性能、自进化过程和顿悟时刻 4. DeepSeek-R1&am…...

编程日记 2026/4/9 5:21:09

一周学会Flask3 Python Web开发-post请求与参数获取

锋哥原创的Flask3 Python Web开发 Flask3视频教程&#xff1a; 2025版 Flask3 Python web开发 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili app.route 装饰器默认只支持get请求。假如我们要让绑定的视图函数支持其他请求方式&#xff0c;我们可以在methods属性里配置…...

编程日记 2026/3/1 1:31:32

Python的那些事第二十五篇：高效Web开发与扩展应用实践FastAPI

FastAPI：高效Web开发与扩展应用实践 摘要 FastAPI 是一种基于 Python 的现代 Web 框架，以其高性能、自动文档生成、数据验证和异步支持等特性受到开发者的青睐。本文首先介绍了 FastAPI 的核心特性及其开发流程，然后通过实际案例探讨了其在异步编程、微服务架构、WebSocket…...

编程日记 2026/4/16 13:42:52

ES6模块化和CommonJs模块化区别

ES6模块化和CommonJs模块化区别 在JavaScript中&#xff0c;模块化是将代码拆分成独立的块&#xff0c;每个块可以独立封装和管理。ES6模块化和CommonJS是两种常见的模块化规范&#xff0c;它们在语法、加载方式和运行时特性上有显著差异。 语法差异 CommonJS模块使用requir…...

编程日记 2026/2/15 19:11:46

情书网源码 情书大全帝国cms7.5模板

源码介绍 帝国cms7.5仿《情书网》模板源码&#xff0c;同步生成带手机站带采集。适合改改做文学类的网站。 效果预览 源码获取 情书网源码 情书大全帝国cms7.5模板...

编程日记 2026/4/15 1:49:35

文档检测校正的重要性

鸿蒙操作系统&#xff08;HarmonyOS&#xff09;是华为推出的一款面向未来、面向全场景的分布式操作系统。它旨在为用户提供流畅、安全、可靠的跨设备交互体验&#xff0c;支持多种终端设备&#xff0c;如智能手机、平板电脑、智能穿戴设备等。为了确保文档在不同设备上的一致性…...

编程日记 2026/2/20 7:31:28

深入解析iOS视频录制（二）：自定义UI的实现

深入解析 iOS 视频录制&#xff08;一&#xff09;&#xff1a;录制管理核心MWRecordingController 类的设计与实现 深入解析iOS视频录制&#xff08;二&#xff09;&#xff1a;自定义UI的实现​​​​​​​ 深入解析 iOS 视频录制&#xff08;三&#xff09;&#xff1a;完…...

编程日记 2026/4/12 6:51:22

基于开源Odoo、SKF Phoenix API与IMAX-8数采网关的圆织机设备智慧运维实施方案 ——以某纺织集团圆织机设备管理场景为例

一、方案背景与需求分析 1.1 纺织行业设备管理痛点 以某华东地区大型纺织集团为例&#xff0c;其圆织机设备管理面临以下挑战&#xff1a; 非计划停机损失高&#xff1a;圆织机主轴轴承故障频发&#xff0c;2024年单次停机损失达12万元&#xff08;停机8小时导致订单延误&am…...

编程日记 2026/4/14 9:49:12

Deepseek 万能提问公式：高效获取精准答案

### **Deepseek 万能提问公式&#xff1a;高效获取精准答案** 在使用 Deepseek 或其他 AI 工具时&#xff0c;提问的质量直接决定了答案的精准度和实用性。以下是一个万能的提问公式回答&#xff1a; --- ### **1. 明确背景&#xff08;Context&#xff09;** - **作用**…...

编程日记 2026/4/11 22:01:11

SQL进阶技巧：如何统计用户跨端消费行为？

目录 0 问题描述 2 问题剖析 技术难点解析 3 完整解决方案 步骤1：构造全量日期平台组合 步骤2：用户行为标记 步骤3：最终关联聚合 4 核心技巧总结 5 复杂度评估 往期精彩 0 问题描述 支出表: Spending +-------------+---------+ | Column Name | Type | +-----…...

编程日记 2026/4/1 18:26:34