用 <p> 和 <h3> 写语义化HTML：<h3>小节标题</h3><p>段落内容。</p>，避免空<p>、跳级标题、未闭合标签；图片必加src和alt，链接需href及安全属性rel="noopener"。
怎么用 <p></p> 和 <h3></h3> 写一段可读内容
HTML 里加文字，不是直接打字就行，得套进有语义的标签里。比如段落用 <p></p>，小标题用 <h3></h3> —— 别用 <div> 或空 <code><span></span> 硬撑，屏幕阅读器和搜索引擎都靠这些标签理解结构。
常见错误是把所有文字塞进一个 <div>，或者写成这样：<code><p>第一章</p>
<p>正文开始…</p>
<p>（空行）</p>
<p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p>——<p></p> 本身就有上下边距，连续多个会撑开过大间距，想“空一行”其实该用新段落，而不是手动加空 <p></p>。
-
<h3></h3>表示三级标题，适合章节内小节；别从<h1></h1>跳到<h3></h3>，跳级会影响语义层级 - 中文段落不用手动敲两个空格换行，
<p></p>自动块级换行；想强制折行用<br>，但仅限地址、诗行等少数场景 - 标签必须闭合：
<p>文字</p>可以，<p>文字</p>不行（XHTML 风格已过时，但现代 HTML5 仍要求配对闭合）
插入图片和链接时最常漏掉的属性
新手贴图经常只写 <img src="a.jpg" alt="HTML新手怎么添加内容_基础内容编辑方法【方法】" >，结果图片不显示还报错。核心问题是缺 src 路径对不上，或没加 alt —— 不是“可选”，而是 WCAG 合规硬性要求，没 alt 的图片对视障用户就是黑洞。
链接也一样：<a href="page.html">点我</a> 看似完整，但如果目标是新窗口，得加 target="_blank"，同时必须配 rel="noopener"，否则有安全风险（父页能通过 window.opener 控制新页）。
-
src路径区分相对/绝对："./images/logo.png"是当前目录下images文件夹，"/images/logo.png"是网站根目录起算 -
alt值要描述图像内容，不是写“图片”或留空；纯装饰图可写alt=""（空字符串），但不能删掉这个属性 -
<a></a>的href不能为空字符串或"#"，那会刷新页面或跳顶；真不需要跳转，改用button+ JS
文本格式化：别用 <font></font>，但 <strong></strong> 和 <em></em> 得分清
<font></font> 标签在 HTML5 中已废弃，浏览器虽还支持，但 CSS 才是管样式的正道。不过语义化标签不能省：<strong></strong> 表示内容重要性高（如警告、关键参数），<em></em> 表示语气强调（如反语、重音），两者默认样式可能一样，但对辅助技术和 SEO 有实质影响。
常见混淆是把加粗当强调，比如写价格 “<strong>¥99</strong>”，其实只是视觉突出，没语义权重；真要强调“限时特惠”，才该用 <strong></strong> 包住整个短语。
- 避免嵌套
<strong><em>...</em></strong>，语义冲突；需要双重强调时，优先用 CSS 类控制样式 - 斜体不用
<i></i>，除非是科技术语、船名、外文词等特定场景；日常“强调”请用<em></em> - 行内代码用
<code>，比如提到函数名console.log()或配置项max-width，别用<pre class="brush:php;toolbar:false;"></pre>（那是整块代码用的）
保存和预览时发现内容没变？检查这三处
改完 HTML 文件刷新网页却还是旧内容，大概率不是代码问题，而是缓存或路径链路断了。本地双击打开文件（file:// 协议）和服务器打开（http://）行为差异极大，很多新手卡在这一步。
- 浏览器强刷：Mac 用
Cmd+Shift+R，Windows 用Ctrl+F5，绕过缓存直接读硬盘文件 - 检查地址栏协议：如果看到
file:///Users/xxx/index.html，某些功能（如 AJAX、部分src跨目录引用）会被浏览器策略拦截；建议用 VS Code 插件 Live Server 或 Python 快速启个本地服务 - 右键“查看页面源代码”，确认看到的是你刚保存的内容；如果源码没更新，说明编辑器没真正保存（比如用了暂存模式、或保存到了错误路径）
HTML 编辑真正的复杂点不在语法多难，而在于每个标签背后都有语义、兼容性和协作约定。写完别急着看效果，先问一句：这段标记，对键盘用户、手机朗读软件、搜索引擎，是不是也能准确传达意思？
