浏览器默认 display: block 的常见标签包括、、–、、、、、、、、、、、、、等，HTML5 语义标签如、也默认块级。
HTML 块级元素没有固定“清单”，但浏览器默认渲染为块级的常见标签就那么十几个，用错或滥用反而会破坏语义和可访问性。
哪些标签默认是块级元素？
浏览器对某些标签有内置的 display: block 样式，典型如：<div>、<code><p></p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/xiazai/skill11445" title="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审"><img
src="https://img.php.cn/upload/skill/001/246/273/6adaf20e695c2374.jpg" alt="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/xiazai/skill11445" title="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审">使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审</a>
<p>使用经过文档化的设计技能，从真实的品牌或项目背景中生成HTML原生原型、幻灯片、动态演示、可视化图表和评审流程。</p>
</div>
<a href="/xiazai/skill11445" title="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div>、<h1></h1>–<h6></h6>、<ul></ul>、<ol></ol>、<li>、<dl></dl>、<dt></dt>、<dd></dd>、<blockquote></blockquote>、<pre class="brush:php;toolbar:false;"></pre>、<hr>、<table>、<code><form></form>、<fieldset></fieldset>、<address></address>。注意：<main></main>、<section></section>、<article></article> 等新语义标签也默认块级，但它们的价值不在“换行”，而在结构表达。
为什么不能只看“是否换行”来判断块级？
块级行为本质是 CSS 渲染结果，不是 HTML 标签的固有属性。比如：<span></span> 加上 style="display: block" 就表现得像块级；反过来，<div> 设成 <code>display: inline 就不再独占一行。常见误判场景包括：
- 把
<button></button>当作纯内联——它默认是display: inline-block，既可设宽高又能同行排列 - 以为
<img alt="HTML块级元素有哪些_html常见块级元素标签一览【进阶】" >是块级——它默认是内联（inline），但因替换元素特性常被误认为“自动换行” - 在 Flex/Grid 容器中，子元素的块/内联表现完全由容器控制，
display值可能被覆盖
什么时候该用块级标签，而不是靠 CSS 强行改？
核心原则：用标签表达内容意图，用 CSS 控制呈现方式。例如：
立即学习“前端免费学习笔记（深入）”；
- 用
<p></p>表示一段完整文字段落，而不是用<div> + <code>margin模拟 - 用
<ul></ul>+<li>表达无序列表项，而非一堆<div> 手动加圆点 <li>用 <code><nav></nav>包裹主导航，即使它视觉上是横向排列（CSS 可设display: flex）
否则屏幕阅读器可能无法识别结构，SEO 也可能弱化语义权重。
容易被忽略的兼容性细节
老版本 IE（如 IE8）对部分 HTML5 块级语义标签（<section></section>、<article></article> 等）不识别，需用 document.createElement 或 html5shiv 激活样式支持。另外：<hr> 和 <br> 常被混淆——<hr> 是块级分隔符，<br> 是内联换行符，二者语义与渲染行为完全不同。
