HTML5页面中文乱码需统一设置UTF-8编码：一、在<head>中添加<meta charset="utf-8">并以UTF-8无BOM保存文件；二、通过服务器配置（Apache/Nginx/Node.js）设置HTTP响应头Content-Type为charset=utf-8；三、编辑器中强制保存为UTF-8无BOM格式；四、用开发者工具Network面板验证Response Headers中Content-Type是否含charset=utf-8。
如果您在HTML5页面中遇到中文显示为乱码的问题，通常是由于文档未正确声明字符编码导致浏览器无法准确解析文本内容。以下是设置HTML5页面编码的几种有效方法：
一、使用meta charset声明UTF-8编码
这是HTML5标准推荐的方式，通过在文档头部的<head>内插入meta标签明确指定字符集为UTF-8，确保浏览器以统一编码解析页面内容。
1、在HTML文件的<head>标签内部第一行（或至少在任何可能输出文本内容的标签之前）添加以下代码：
<meta charset="utf-8">
立即学习“前端免费学习笔记（深入）”；
2、确认该标签未被注释、未拼写错误（如误写为"UTF8"或"utf_8"），且不包含多余空格或引号类型错误（必须使用英文双引号或单引号）。
3、保存文件时，确保编辑器以UTF-8无BOM格式编码保存源文件，否则meta声明与实际文件编码不一致仍将引发乱码。
二、在HTTP响应头中设置Content-Type编码
服务器可通过HTTP响应头直接告知浏览器应使用的字符编码，其优先级高于HTML内的meta声明，可从根本上避免前端声明失效的情况。
1、若使用Apache服务器，在站点根目录或对应目录下创建或编辑.htaccess文件，添加以下行：
AddDefaultCharset UTF-8
2、若使用Nginx服务器，在server或location配置块中加入：
charset utf-8;
3、若使用Node.js（如Express），在响应前设置头信息：
res.set('Content-Type', 'text/html; charset=utf-8');
三、在编辑器中强制保存为UTF-8无BOM格式
即使HTML中已声明meta charset="utf-8"，若源文件本身以GBK、ANSI或UTF-8 with BOM等编码保存，浏览器仍可能因BOM干扰或编码冲突导致解析异常。
1、在VS Code中，点击右下角编码显示区域（如显示“UTF-8”或“GBK”），选择“Save with Encoding” → “UTF-8”。
2、在Sublime Text中，依次点击File → Save with Encoding → UTF-8。
3、在Notepad++中，点击编码菜单 → 选择“UTF-8（无BOM）”，再执行保存。
四、验证编码是否生效
通过浏览器开发者工具检查当前页面实际应用的编码方式，可确认上述设置是否成功覆盖默认行为。
1、在Chrome中按F12打开开发者工具，切换到Network选项卡。
2、刷新页面，点击左侧列表中的HTML文件名（如index.html）。
3、在Headers子面板的Response Headers中查找Content-Type字段，确认其值包含charset=utf-8。
4、若未出现，说明服务器头未设置或被覆盖；若出现但页面仍乱码，则需检查文件实际保存编码是否匹配。
