1、有哪些行内元素、块级元素、空元素？

目录

一、先给一个标准面试回答

二、常见块级元素

常见块级元素

三、常见行内元素

常见行内元素

四、常见行内块元素

常见行内块元素

五、什么是空元素？

常见空元素

六、最常见的空元素，面试常答这些就够了

七、面试里的加分点：不是绝对的

八、面试时容易出错的点

1. a 是行内元素

2. img 常被记混

3. input、button 也比较特殊

九、推荐你背的版本

块级元素

行内元素

空元素

十、面试高分回答模板

十一、简洁背诵版

十二、一句话总结

这是前端面试里的经典基础题。
但要注意：

HTML 元素的“行内 / 块级”说法，主要是早期和面试里的习惯表达。
更严格地说，它们默认的display不同，比如block、inline、inline-block等。

不过面试时，按传统分类回答就可以。

一、先给一个标准面试回答

常见的 HTML 元素可以分为：

• 块级元素：独占一行，默认宽度通常撑满父容器
• 行内元素：不独占一行，通常只占自身内容宽度
• 空元素：没有闭合内容，本身不能再包文本内容的元素

常见块级元素有div、p、h1~h6、ul、ol、li、section、article、header、footer等；
常见行内元素有span、a、strong、em、label、i、b、small等；
常见空元素有img、input、br、hr、meta、link等。

这段已经可以应付大多数面试。

二、常见块级元素

块级元素的特点：

• 默认独占一行
• 默认宽度会尽量撑满父元素
• 一般可以设置宽高
• 可以包裹块级元素和部分行内元素

常见块级元素

div p h1 h2 h3 h4 h5 h6 ul ol li dl dt dd table form header footer section article nav aside main blockquote pre

三、常见行内元素

行内元素的特点：

• 不会独占一行
• 宽高通常由内容决定
• 直接设置width、height往往不生效（传统 inline 元素）
• 一般只能容纳文本或其他行内元素

常见行内元素

span a strong em b i u small label sup sub abbr cite code q time

四、常见行内块元素

有些面试官会顺带问这个。

行内块元素特点：

• 不独占一行
• 但可以设置宽高

常见行内块元素

img input button textarea select

严格来说，这类常被单独归为inline-block / replaced element相关范畴。
面试里如果提一句，会显得更全面。

五、什么是空元素？

空元素指的是：

没有内容、不能包含子节点、通常不需要闭合标签内容的元素

也有人叫：

• 自闭合元素
• void elements

常见空元素

br hr img input link meta area base col embed param source track wbr

六、最常见的空元素，面试常答这些就够了

如果怕记太多，至少记住：

• br
• hr
• img
• input
• meta
• link

这几个最常见。

七、面试里的加分点：不是绝对的

你可以补一句：

行内和块级是元素的默认显示特性，但可以通过 CSS 的display改变。
比如div可以设成display: inline，span也可以设成display: block。

例如：

div { display: inline; } span { display: block; }

这会显得你理解不只是死记硬背。

八、面试时容易出错的点

1.a是行内元素

这个没问题。

但要注意：

• a在 HTML5 里可以包块级内容
• 这和早期规范有些不同

所以如果面试官深入问，你可以说：

a默认是行内元素，但在 HTML5 中它可以包裹流内容。

2.img常被记混

img常被当作行内元素来记，但它更准确地说属于：

• 行内替换元素

它默认表现接近行内，但又有自己的特殊布局行为。

面试里一般说它是行内元素 / 行内块特性明显都能接受。

3.input、button也比较特殊

它们不是传统纯文本行内元素，更接近：

• 行内块
• 替换元素

但大多数面试里不会卡这么细。

九、推荐你背的版本

块级元素

• div
• p
• h1~h6
• ul
• ol
• li
• table
• form
• header
• footer
• section
• article
• nav

行内元素

• span
• a
• strong
• em
• b
• i
• label
• small

空元素

• img
• input
• br
• hr
• meta
• link

十、面试高分回答模板

HTML 里常见元素按默认显示特性可以分成块级元素、行内元素和空元素。

块级元素默认独占一行，比如div、p、h1~h6、ul、li、section、article。
行内元素默认不会独占一行，比如span、a、strong、em、label。
空元素指没有内容、不能包含子节点的元素，比如img、input、br、hr、meta、link。

不过这只是默认表现，实际开发中也可以通过display修改，比如把span改成块级，把div改成行内。

十一、简洁背诵版

块级元素常见有：div、p、h1~h6、ul、li、form；
行内元素常见有：span、a、strong、em、label；
空元素常见有：img、input、br、hr、meta、link。

行内和块级是默认显示特性，可以通过display修改。

十二、一句话总结

块级元素独占一行，行内元素不独占一行，空元素没有内容和闭合内容。