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
相关推荐
凤山老林36 分钟前
从美团全栈化看 AI 冲击:前端转全栈,是自救还是必然
前端·人工智能·状态模式
777VG8 小时前
PostgreSQL +martin将多张表输出成一个 MVT
前端·数据库·postgresql
mayaairi8 小时前
JS循环语句深度解析:嵌套for、while与do...while
开发语言·前端·javascript
To_OC8 小时前
啃完流式输出:从一个卡顿的 LLM 接口开始,我搞懂了数据流到底怎么 “流”
前端·javascript·llm
阳光是sunny9 小时前
LangGraph实战教程:defer延迟节点——让收尾工作自动排到最后
前端·人工智能·后端
kyriewen9 小时前
我用了三周Claude Code Skills——总结出5条铁律,第3条最反直觉
前端·ai编程·claude
阳光是sunny9 小时前
LangGraph实战教程:控制流详解
前端·人工智能·后端
格尔曼Noah10 小时前
Safari浏览器中如何只允许指定网站下载
前端·safari
用户0595401744611 小时前
用了3年Redis,才发现我一直没搞懂缓存一致性测试
前端·css
swipe11 小时前
07|(前端转后全栈)为什么后端也要缓存?从前端缓存思维理解 Redis
前端·后端·全栈