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
相关推荐
michael_ouyang9 小时前
WebSocket 鉴权方案选型与 Electron 应用的最佳实践
前端·websocket·网络协议·electron
xixixin_9 小时前
【vue】中字符串与数组转换:为何首选 Computed 而非 Methods?
前端·javascript·vue.js
Sylvia33.9 小时前
网球/羽毛球数据API:专业赛事数据服务的技术实现
java·前端·websocket·json
向下的大树10 小时前
VUE父子组件传参中的触发时机问题:异步场景下的解决方案
前端·javascript·vue.js
英俊潇洒美少年10 小时前
vue2中使用节流防抖函数时,使用的vue状态始终是初始化的数据
前端·javascript·vue.js
棒棒的唐10 小时前
适合小程序使用的将对象数组转换为参数字符串方法
前端·javascript·小程序
博客zhu虎康10 小时前
音频视频处理:前端直播流播放 flv
前端
一位搞嵌入式的 genius10 小时前
深入理解 JavaScript 原型与继承:从基础到进阶
开发语言·前端·javascript
董世昌4110 小时前
深度解析var、let、const的区别与最佳使用场景
开发语言·前端·javascript
C_心欲无痕11 小时前
Next.js 平行路由:构建模块化动态布局
开发语言·前端·javascript