HTML 常用标签速查表

HTML 常用标签速查表


🧱 结构类标签

标签 含义 用途说明
<html> HTML文档根元素 所有HTML内容的根节点
<head> 头部信息 放置元信息,如标题、引入CSS/JS等
<body> 页面内容主体 所有可视内容的容器

📝 文本与标题标签

标签 含义 用途说明
<h1> ~ <h6> 标题 <h1>最大,依次变小
<p> 段落 用于段落文本
<br> 换行 强制换行(单标签)
<hr> 水平线 用于分隔内容(单标签)
<strong> 强调加粗 语义强调,视觉加粗
<em> 斜体强调 表示语义上强调
<b> 加粗 仅视觉加粗,无语义
<i> 斜体 仅视觉斜体,无语义
<span> 行内容器 无语义,便于样式控制
<div> 区块容器 无语义,用于布局划分

富文本标签

📋 列表标签

标签 含义 用途说明
<ul> 无序列表 项目前有圆点
<ol> 有序列表 项目前有编号
<li> 列表项 用于ulol

🧩 表格标签

标签 含义 用途说明
<table> 表格容器 创建表格
<tr> 表格行 一行内容
<td> 表格单元格 表格中的数据格
<th> 表头单元格 表格中的标题格
<thead> 表头区域 分离表格头部
<tbody> 表格主体 表格主体部分
<tfoot> 表格底部 表格汇总行等

🔗 外部资源标签(超链接和媒体)

标签 含义 用途说明
<a href=""> 超链接 可跳转页面或地址
<img src=""> 图片 显示图片,单标签
<video> 视频 嵌入视频播放
<audio> 音频 嵌入音频播放
<source> 媒体资源 配合<video><audio>使用

🧾 表单相关标签

标签 含义 用途说明
<form> 表单容器 收集用户输入
<input> 输入框 类型由type决定
<textarea> 多行输入 文本框
<select> 下拉框 配合<option>使用
<option> 下拉项 用于<select>
<label> 标签 表单项描述
<button> 按钮 提交、重置或自定义行为

📦 语义化标签(HTML5)

标签 含义 用途说明
<header> 页头 放logo、导航等
<nav> 导航区域 链接菜单等
<main> 主内容区域 页面核心内容
<section> 区块 相对独立的内容区域
<article> 文章 独立内容,如文章、帖子
<aside> 侧边栏 相关信息、推荐等
<footer> 页脚 版权、声明等
相关推荐
yuhaiqiang4 分钟前
被 AI 忽悠后,开始怀念搜索引擎了?
前端·后端·面试
红色石头本尊21 分钟前
1-umi-前端工程化搭建
前端
真夜28 分钟前
关于对echart盒子设置百分比读取的宽高没有撑开盒子解决方案
前端
楠木68541 分钟前
RAG 资料库 Demo 完整开发流程
前端·ai编程
肠胃炎1 小时前
挂载方式部署项目
服务器·前端·nginx
像我这样帅的人丶你还1 小时前
使用 Next.js + Prisma + MySQL 开发全栈项目
前端
FPGA小迷弟1 小时前
FPGA 时序约束基础:从时钟定义到输入输出延迟的完整设置
前端·学习·fpga开发·verilog·fpga
毛骗导演1 小时前
@tencent-weixin/openclaw-weixin 插件深度解析(四):API 协议与数据流设计
前端·架构
毛骗导演1 小时前
@tencent-weixin/openclaw-weixin 插件深度解析(二):消息处理系统架构
前端·架构
IT_陈寒2 小时前
深入理解JavaScript:核心原理与最佳实践
前端·人工智能·后端