HTML 常用的块级元素和行内元素

1. 常用的块级元素

  • 块级元素具有如下特点:

    • 占据父容器的整行宽度。
    • 通常从新的一行开始。
    • 可以包含其他块级元素和行内元素。
  • 常用的块级元素:

    div:通用的容器,用于布局和分块内容。

    h1 到 h6:标题标签,定义从一级标题到六级标题。

    p:段落标签,用于定义文本段落。

    ul 和 ol:无序列表和有序列表,分别用于定义项目符号列表和编号列表。

    li:列表项,用于在列表(ul 或 ol)中定义项目。

    blockquote:块级引用,用于引用大段的文本。

    header:页面或部分内容的头部。

    footer:页面或部分内容的底部。

    section:用于页面中定义内容的一个区块。

    article:表示页面中的一篇文章或独立的内容块。

    nav:定义导航链接的容器。

    aside:表示与页面主要内容相关的侧边内容。

    form:用于创建表单。

    table:定义表格结构。

  • 其他常见的块级元素:

    hr:水平线,通常用于分割内容。

    figure:用于包含图像、图表或其他插图。

    figcaption:定义 figure 的标题或说明。

2. 常用的行内元素

  • 行内元素具有如下特点:

    • 只占据内容所需的宽度,不会从新的一行开始。
    • 不能包含块级元素,但可以包含其他行内元素或文本。
  • 常用的行内元素:

    span:通用的行内容器,通常用于局部样式化文本。

    a:链接标签,用于创建超链接。

    strong:用于表示重要的内容,通常显示为加粗文本。

    em:用于表示强调内容,通常显示为斜体文本。

    img:图像标签,用于嵌入图像。

    br:换行符,用于在文本中换行。

    i:斜体文本,通常用于表示不同语言或名词。

    b:加粗文本,用于强调部分内容。

    u:下划线文本。

    code:表示计算机代码,通常显示为等宽字体。

    small:用于显示小号文本。

    sub:下标文本。

    sup:上标文本。

    label:表单标签,用于描述表单控件。

  • 其他常见的行内元素:

    mark:用于高亮文本。

    time:表示时间或日期。

    abbr:表示缩写。

    cite:用于引用标题或作品名称,通常显示为斜体。

    q:短引用,表示短的行内引用文本。

3 总结:

块级元素 行内元素
div span
p a
h1-h6 strong
ul,ol li,em
table i,b,u
blockquote img
header,footer br
article,section code
nav label
aside mark,time,q
相关推荐
Moment9 小时前
Vibe Coding 时代,到底该选什么样的工具来提升效率❓❓❓
前端·后端·github
IT_陈寒10 小时前
SpringBoot性能飙升200%?这5个隐藏配置你必须知道!
前端·人工智能·后端
小时前端11 小时前
React性能优化的完整方法论,附赠大厂面试通关技巧
前端·react.js
Nicko11 小时前
Jetpack Compose BOM 2026.02.01 解读与升级指南
前端
小蜜蜂dry11 小时前
nestjs学习 - 控制器、提供者、模块
前端·node.js·nestjs
优秀稳妥的JiaJi11 小时前
基于腾讯地图实现电子围栏绘制与校验
前端·vue.js·前端框架
前端开发呀12 小时前
从 qiankun(乾坤) 迁移到 Module Federation(模块联邦),对MF只能说相见恨晚!
前端
没想好d12 小时前
通用管理后台组件库-10-表单组件
前端
恋猫de小郭12 小时前
你用的 Claude 可能是虚假 Claude ,论文数据告诉你,Shadow API 中的欺骗性模型声明
前端·人工智能·ai编程
_Eleven13 小时前
Pinia vs Vuex 深度解析与完整实战指南
前端·javascript·vue.js