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
相关推荐
云老大-阿里云国际站代理商4 小时前
华为云国际站渠道代理商:CSS查询很慢但CPU不高?磁盘I/O、JVM与分片问题怎么排查
css·jvm·华为云
console.log('npc')4 小时前
[特殊字符] AI Agent 工作台前端实战教程 · 新手入门指南
前端·人工智能
gCode Teacher 格码致知4 小时前
前端教学2:ul标签的应用场合与经典案例
前端
const_qiu4 小时前
第 2.5 章 2.5.6:前端登录、Token 无感续签与路由守卫
java·前端·人工智能·状态模式
用户83134859306984 小时前
Vue3 事件:常用用法与开发高频坑点
前端·javascript·vue.js
weixin_446260854 小时前
ReAct‑Evolve:基于轨迹反馈的ReAct智能体自主提示演化系统
前端·react.js·前端框架
其实防守也摸鱼4 小时前
存储管理:页面置换算法学习任务(测验题要求给出置换页面顺序,缺页次数,缺页率)
android·前端·数据库·学习·oracle·自动化
怒放的生命19914 小时前
前端项目 Docker 打包实操指南
前端·docker·容器
tedcloud1234 小时前
Docker Compose 部署 Immich:手机照片自动备份与常见故障排查
运维·前端·docker·容器·智能手机·开源·流程图
时间的情敌5 小时前
《WebGIS 前端的成长路线,三维可视化工程师需要掌握什么》
前端·状态模式