直接双击html文件即可看到文本标签效果；前提是文件以.html为后缀、utf-8无bom编码，且用浏览器打开而非文本编辑器，否则可能显示源码或乱码。
直接双击打开HTML文件就能看到文本标签效果
HTML文本标签（比如<h1></h1>、<p></p>、<br>）本身不“运行”，它们只是被浏览器解析后渲染成可视内容。只要把含这些标签的代码保存为.html文件，并用浏览器打开，就能立刻看到效果。
关键前提是：文件必须以.html为后缀，且编码选UTF-8 无BOM。记事本另存时，“保存类型”要选“所有文件”，否则可能变成test.html.txt——这种文件双击会打不开或显示源码，不是浏览器解析失败，是根本没被识别为HTML。
- 错例：
index.txt或page.html但实际是ANSI编码 → 浏览器显示乱码或空白 - 对例：
demo.html，用VS Code保存时底部状态栏明确显示UTF-8（非UTF-8 with BOM） - 验证方式：右键页面 → “查看网页源代码”，确认首行是
，且<code><h1>测试</h1>这类标签原样存在
用开发者工具实时检查和修改文本标签渲染
浏览器开发者工具（F12 或 Ctrl+Shift+I）是调试文本标签最直接的方式。它不依赖外部工具，改一行就看一行效果，比反复保存刷新快得多。
常见调试动作：
- 在Elements面板里点开
<h2></h2>节点，右侧Styles会显示默认样式（如font-size: 1.5em、margin-top: 0.83em），说明它不是纯文字，而是带语义和默认布局的块级元素 - 双击Elements里的
<p></p>文本，可临时编辑内容，观察换行、间距是否符合预期 - 右键某个
<br>→ “Delete element”，立刻看到换行消失，验证它是否被误用（比如用<br>代替<p></p>分段） - 勾选/取消Styles中
display: block，看标题是否还独占一行——这是理解<h1>~<h6></h6> </h1>默认行为的关键
为什么<b></b>和<strong></strong>看起来一样却要区分？
视觉上<b></b>和<strong></strong>都加粗，但语义不同：前者只强调样式，后者表示内容重要性。这对屏幕阅读器、SEO和未来维护影响很大，不是“看起来一样就随便用”。
调试时容易忽略的点：
- 用Chrome的Lighthouse审计，选“Accessibility”，它会报出
<b></b>未提供语义强度的提示 - 开启系统级屏幕阅读器（如NVDA），读到
<strong></strong>时会加重语气，<b></b>则无特殊处理 - 如果后续加CSS重置了
font-weight，<strong></strong>仍可通过aria-strong等机制保留语义，<b></b>彻底丢失上下文
涉及路径或外部资源时，<img>和<link>失效怎么办？
文本标签本身不依赖HTTP，但如果你在<p></p>里放了<img src="logo.png">，或用<link rel="stylesheet" href="style.css">控制标题样式，那双击打开就可能出问题——现代浏览器对file://协议有严格跨域限制。
此时不能只看文本标签是否显示，得查Network面板：
- 刷新页面，切换到Network → 过滤
Img或css，看logo.png状态码是不是failed或blocked - 如果是，说明路径没错但协议受限，必须启动本地服务器：终端进目录，运行
http-server（需提前npm install -g http-server），然后访问http://localhost:8080 - 注意：
<img>的alt属性会在图片加载失败时显示文字，这是唯一能确认标签被解析但资源未加载的线索
真正卡住人的往往不是标签怎么写，而是文件没保存对、编码选错、或者以为<br>能替代段落结构。浏览器不会告诉你“你用了错误的换行方式”，它只会默默按规范渲染——所以调试第一反应不该是改代码，而是打开开发者工具看它到底解析成了什么。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
