HTML基本结构标签

标签名 定义 说明
<html></html> HTML标签 页面中最大的标签,称为根标签
<head></head> 文档的头部 必须设置title标签
<title></title> 文档的标题 页面标题
<body></body> 文档的主体 包含文档的所有内容

基本结构示例:

<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>页面标题</title> </head> <body> <h1>我的第一个网页</h1> <p>欢迎来到我的网站!</p> </body> </html>

文本标签

标题标签 <h1> 到 <h6>

一级标题

二级标题

三级标题

四级标题

五级标题
六级标题

文本格式化标签

语义 标签 说明
加粗 <strong> 或 <b> 推荐使用 <strong> 语义更强烈
倾斜 <em> 或 <i> 推荐使用 <em> 语义更强烈
删除线 <del> 或 <s> 推荐使用 <del> 语义更强烈
下划线 <ins> 或 <u> 推荐使用 <ins> 语义更强烈

加粗文本加粗文本

倾斜文本倾斜文本

删除线文本删除线文本

下划线文本下划线文本

<div> 和 <span> 标签

这是一个div块级元素,通常用于布局容器

这是一段文本,其中span元素用于对文本的一部分进行样式设置。

多媒体标签

图像标签 <img>

图像属性:

  • src:图像路径(必须)
  • alt:替代文本(图像无法显示时)
  • title:悬停提示文本

路径示例:

<img src="image.jpg" alt="描述"> // 同一级路径

<img src="images/image.jpg"> // 下一级路径

<img src="../image.jpg"> // 上一级路径

占位图像

示例图像

音频标签 <audio>

属性:

  • src:音频URL(必须)
  • controls:显示控制面板
  • loop:循环播放
  • autoplay:自动播放

视频标签 <video>

属性:

  • src:视频URL(必须)
  • controls:显示控制面板
  • muted:静音播放
  • loop:循环播放
  • autoplay:自动播放
  • poster:加载等待画面

表单元素

表单域 <form>

属性 作用
action url地址 指定处理表单数据的服务器URL
method get/post 设置表单数据的提交方式
name 名称 指定表单名称,区分多个表单

输入元素 <input>

HTML5语义化标签

<header> - 页面头部
<article> - 主要内容
<section> - 内容区块
<footer> - 页脚

HTML5表单增强