HTML 常用标签速查表
🧱 结构类标签
标签 | 含义 | 用途说明 |
---|---|---|
<html> |
HTML文档根元素 | 所有HTML内容的根节点 |
<head> |
头部信息 | 放置元信息,如标题、引入CSS/JS等 |
<body> |
页面内容主体 | 所有可视内容的容器 |
📝 文本与标题标签
标签 | 含义 | 用途说明 |
---|---|---|
<h1> ~ <h6> |
标题 | <h1> 最大,依次变小 |
<p> |
段落 | 用于段落文本 |
<br> |
换行 | 强制换行(单标签) |
<hr> |
水平线 | 用于分隔内容(单标签) |
<strong> |
强调加粗 | 语义强调,视觉加粗 |
<em> |
斜体强调 | 表示语义上强调 |
<b> |
加粗 | 仅视觉加粗,无语义 |
<i> |
斜体 | 仅视觉斜体,无语义 |
<span> |
行内容器 | 无语义,便于样式控制 |
<div> |
区块容器 | 无语义,用于布局划分 |
富文本标签
📋 列表标签
标签 | 含义 | 用途说明 |
---|---|---|
<ul> |
无序列表 | 项目前有圆点 |
<ol> |
有序列表 | 项目前有编号 |
<li> |
列表项 | 用于ul 或ol 中 |
🧩 表格标签
标签 | 含义 | 用途说明 |
---|---|---|
<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> |
页脚 | 版权、声明等 |