介绍

如果在其他编码类型的浏览器中显示源代码等文本文件,则会出现乱码。
我将解释如何在 HTML 中指定字符编码并纠正乱码。

目次

1.什么是字符编码?
2. 编码类型是什么 代码与字符的对应关系 表
3. 指定HTML中的编码类型
4. 转换编码

1.什么是字符编码?

一言以蔽之,就是“将字符数据转换为数值”。
计算机只能“以数字方式”理解数据。因此,在处理“字符”时,将其转换为“数值”并进行处理。这种转换称为字符编码。

2、编码类型是数字和字母的对应表。

为了让计算机理解“字母”,需要一个“数字”和“字母”的对应表。
该对应表有多种类型,要处理的对应表根据OS的类型而不同。例如,Windows 处理不同对应表中的文本,例如 Shift_JIS 和 UNIX 以及 UTF-8 中的 Mac。
该对应表称为编码类型,无论编码类型如何,都将相同的数字数据分配给字母表。因此,用英文编写的文本文件,即使显示在与创建它的计算机不同的计算机上,也不会出现乱码。
但是,分配给平假名和汉字的数值数据因编码类型而异。
然后,如果你在 Windows 上创建一个文本文件并在 Mac 上显示它,字符就会出现乱码,你将无法阅读它。
所有的操作系​​统都可以处理所有的编码类型,但是默认的编码类型不同,所以会出现乱码。

3.在HTML中指定编码类型

首先,您必须在 HTML 文件中指定要显示的页面上使用的编码类型。如果未指定,内容中的字符将被误解。
为此,请在编写源代码的 HTML 文件的 meta 元素中使用 charset 属性。
此外,语言是日语(lang = "ja"),因为假设字符会出现乱码。

如果要以 UTF-8 显示

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
・・・

如果要在 Shift_JIS 中显示

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="Shift_JIS">
・・・

由于这个charset属性是从HTML5中添加的属性,所以在HTML5之前的HTML版本中通过如下方式描述。

HTML5之前如何指定字符代码

<meta http-equiv="content-type" content="text/html; charset=文字コード">

如果要在 HTML5 之前的版本中以 Shift_JIS 显示

<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">

4.转换编码

使用编辑器查看 HTML 文件。
目前有很多文字是自动识别显示的,如果没有自动识别,需要自己从设置中切换编码类型。
这一次,我们将使用 VScode 在 Shift_JIS 中显示。

VS Code 的默认编码类型是 UTF-8。因此,当显示使用 Shift_JIS 创建的文本文件时,字符会出现乱码。
VS Code 默认具有转换编码类型的能力,因此转换不需要扩展。


点击 VS Code 屏幕底部显示的编码类型(默认为 UTF-8)

从显示的菜单中选择“Reopen with encoding”
↓选择
“Japanese (Shift JIS)”
↓ 无
乱码 Shift_JIS 显示在


参考

如何从 Shift JIS 或 EUC 转换为 UTF-8
字符代码和乱码
http-equiv 属性

如何修复 HTML 中的乱码相关推荐

  1. war包中的乱码修复

    导入war包后,打开想看的demo,demo中出现乱码时 1.打开Windows的Preferences 2.打开General的Workspace 3.将Workspace里的最下面的Other改为 ...

  2. Office word文档中的乱码解决办法

    Office word文档中的乱码解决办法 1.打开被损坏的文档单击"文件/另存为"菜单,在 "保存类型"列表中,选择"RTF格式",然后单 ...

  3. 两招挽救Office word文档中的乱码(转)

    两招挽救Office word文档中的乱码(转)[@more@] 有的时候可能由于操作的问题,当你再次打开一个你认为没有问题的文档时,可能会看见文件中一片乱码更本就无法阅读!如果出现了这写情况可以通过 ...

  4. SQL数据库无法附加 系统表损坏修复 数据库中病毒解密恢复

    SQL数据库无法附加 系统表损坏修复 数据库中病毒解密恢复 开发此工具是为了 让手工恢复数据库物理故障时 更加简单便捷直观, 本工具用于物理修复独立处理大部分问题以及与DBCC配合完成修复各种数据库错 ...

  5. Json返回时间中出现乱码问题的两种解决方法

    Json返回时间中出现乱码问题的两种解决方法 参考文章: (1)Json返回时间中出现乱码问题的两种解决方法 (2)https://www.cnblogs.com/hanyinglong/archiv ...

  6. 解决windows文件在linux系统中显示乱码的问题

    解决windows文件在linux系统中显示乱码的问题 参考文章: (1)解决windows文件在linux系统中显示乱码的问题 (2)https://www.cnblogs.com/liyanpin ...

  7. zabbix的主动模式和被动模式、添加监控主机、添加自定义模板、处理图形中的乱码、自动发现...

    主动模式和被动模式 主动或者被动是相对客户端来讲的 被动模式,服务端会主动连接客户端获取监控项目数据,客户端被动地接受连接,并把监控信息传递给服务端 主动模式,客户端会主动把监控数据汇报给服务端,服务 ...

  8. Myeclipse中js文件中的乱码处理

    Myeclipse中js文件中的乱码处理 导入外部js文件到MyEclipse中打开是乱码,无法设置使用哪种编码格式,总不能在里面加上<%@ page pageEncoding="UT ...

  9. 如何修复 Flutter 中的“正在检查 Dart SDK 版本... << 此时出乎意料”错误?

    如何修复 Flutter 中的"正在检查 Dart SDK 版本- << 此时出乎意料"错误? 每当我尝试从终端运行任何应用程序或 flutter 命令时,我都会遇到问 ...

最新文章

  1. set_origin_pose算子说明
  2. 一个通过Flash设计与Flex结合开发的网站www.mapgle.cn
  3. Lecture 2: Preliminary Review--Mind Map
  4. 大数据之-Hadoop3.x_Hadoop之HDFS_DataNode的工作机制_原理---大数据之hadoop3.x工作笔记0077
  5. 使用xcopy对文件夹进行复制,del、rd 删除文件、文件夹
  6. Windows 2008 限制IP连接方法
  7. 网络协议之ONVIF
  8. 大众点评数据爬虫思路[更新版]
  9. python构建配对t检验(Paired Student’s t-test)
  10. 酷派童年童装×××随
  11. 首个AI数字人唱作歌曲刷屏背后:百度APP数字人度晓晓用AI陪伴亿万用户
  12. 专题:拓扑排序(Topological sort)模式
  13. 2022-2028年中国镓行业市场研究分析及投资前景评估报告
  14. 看你骨骼清奇,老夫决定赐你这份“2018软件测试发光秘籍”
  15. 60个可爱的云图案设计,激发你的灵感
  16. 光缆线路网的组网结构是怎样的
  17. Sparse R-CNN: End-to-End Object Detection with Learnable Proposals论文翻译
  18. 对于模块化的一些见解
  19. Mirai QQ机器人(开源)
  20. web api 数独 求解代码 使用穷举回溯法

热门文章

  1. 【C语言】用一个数组实现两个堆栈
  2. ViSP学习笔记(六):使用ViSP实现常见的图像滤波
  3. win7 无Internet访问权限的解决方法
  4. 判断函数奇偶项的奇偶性
  5. 职场进阶指南:大厂人必看书籍推荐
  6. 国产的开源数据库——GitHub 热点速览 Vol.52
  7. GitHub转华为软件开发云详细教程
  8. 2023年了现在想入局shopee可以吗?
  9. (转)VSAM文件结构及管理
  10. PostgreSQL建表语句