HTML文件乱码一般是因为编码格式不匹配造成的，比如：不同编码内容混杂、浏览器不能自动检测网页编码等等；但无论是哪种情况造成乱码，在HTML文件头中设置网页编码，匹配好编码格式就可。

下面是一个中文乱码的html：

<!DOCTYPE html>

<html>

    <body>

        <h1>标题</h1>

        <p>这是一段测试文本！</p>

    </body>

</html>

效果图：

HTML中的编码方式有三个：gb2312，gbk，utf-8；现在大部分浏览器默认编码的是utf-8。我们只需要把HTML编码方式设置为utf-8，就可以解决html中文乱码的问题。

解决方法：

在head节点加入<meta>标签，把字符声明为UTF-8

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

或者简写：

<meta charset="UTF-8">

 

解析：

●　http-equiv="Content-Type"表示描述文档类型

●　content="text/HTML;文档类型，这里为html,如果JS就是text/javascript，

●　charset=utf-8 页面字符集，编码，eg:gb2312,iso-8859-1,utf-8

示例：

<!DOCTYPE html>

<head>

    <meta charset="UTF-8">

</head>

<html>

    <body>

        <h1>标题</h1>

        <p>这是一段测试文本！</p>

    </body>

</html>

在具体的前端工作中通常HTML页面乱码怎么解决？的更多相关文章

  1. maven-eclipse 中index.html页面乱码

    maven-eclipse 中index.html页面乱码: pox.xml修改: <project> -- <properties> <argLine>-Dfil ...

  2. Js的Url中传递中文参数乱码的解决

    一:Js的Url中传递中文参数乱码问题,重点:encodeURI编码,decodeURI解码: 1.传参页面Javascript代码: 2. 接收参数页面:test02.html 二:如何获取Url& ...

  3. J2EE开发工作中遇到的异常问题及解决方法总结

    参考博文:http://blog.csdn.net/rchm8519/article/details/41624381

  4. 安装wampserver之后，浏览器中输入localhost页面显示IIS7解决办法

    1.wampserver图标为绿色才为正常启动,如果为橘色说明端口(默认为80)被占用:可以点击图标,然后点Apache->Service->测试80端口,来验证端口是否被占用. 如果占用 ...

  5. C# JS URL 中文传参出现乱码的解决方法

    在传参是先编码在传输,接受时先编码,在接收. string mm=Server.URLEncode(你); Response.Redirect(index.aspx?mm=+mm); 然后在接收页解码 ...

  6. Python和Ruby开发中源文件中文注释乱码的解决方法（Eclipse和Aptana Studio3均适用）

    Eclipse的设置(Aptana Studio3与Eclipse基本完全相同,此处略) window->preferences->general->editors->text ...

  7. ASP中 Request.Form中文乱码的解决方法

    分享下解决方法直接用request.Form()获取的是所有数据所以会有乱码(具体原因不祥) 用 VBScript code Foreach obj in Request.Form Response. ...

  8. 中文保存在properties乱码的解决

    方法:将中文转换为Native/ASCII编码:(比较好的一种解决方法,也必须设置好properties的字符编码(utf-8):已经试验成功) 网站:http://tool.oschina.net/ ...

  9. Web前端开发中的MCRV模式(转)

    作者: izujian  来源: baiduux 摘要:针对前端开发中基于ajax的复杂页面开发所面临的代码规模大,难以组织和维护,代码复用性.扩展性和适应性差等问题,本文尝试以MVC思想为 基础,结 ...

随机推荐

  1. java实现趣味拼算式

    匪警请拨110,即使手机欠费也可拨通! 为了保障社会秩序,保护人民群众生命财产安全,警察叔叔需要与罪犯斗智斗勇,因而需要经常性地进行体力训练和智力训练! 某批警察叔叔正在进行智力训练: 1 2 3 4 ...

  2. Python之大数据库hive实战

    今天和大家分享的是Python如何连接hive数据库来进行hivesql的查询操作.   step1:环境准备 Python版本:3.6.2 Windows版本:Windows10版本的64位 ste ...

  3. LoadRunner性能测试笔试/面试题

    客户交付一个性能测试项目,请阐述你的实施流程. 测试设计阶段: 1)了解被测系统的性能需求,定义测试目标和范围: 2)了解系统的技术信息,如系统架构等: 3)确定测试方案.进度安排,并制定测试计划,场 ...

  4. [博主推荐]如何利用注册 的 bug 来疯狂注册,不停开小号"做"事情,支持 手机号&邮箱

    [博主推荐]如何利用注册 的 bug 来疯狂注册,不停开小号"做"事情,支持 手机号&邮箱  非常简单 1.手机号注册: 用手机号注册 网站基本都支持 可以用推荐的网址: ...

  5. 【转载】图解NumPy

    目录 1. 读写文件 2. 内建向量/矩阵 3. 切片操作 4. 聚合函数 4.1. 向量 4.2. 矩阵 5. 矩阵的转置和重构 6. 常用操作API 7. 应用实例 7.1. 生成向量.矩阵 7. ...

  6. mall

    https://github.com/macrozheng mall整合OSS实现文件上传:https://blog.csdn.net/zhenghongcs/article/details/9931 ...

  7. UI 自动化遇到的坑

    1,ElementNotInteractableException: Message: element not interactable 该解决方法是用xpath定位,然后使用js操作元素,点击之类 ...

  8. Web测试和app测试区别？

    EB测试和APP测试从流程上来说,没有区别.都需要经历测试计划方案,用例设计,测试执行,缺陷管理,测试报告等相关活动.从技术上来说,WEB测试和APP测试其测试类型也基本相似,都需要进行功能测试,性能 ...

  9. 【uni-app】uni.request二次封装，更好的管理api接口和使用

    前言 之前写了一个Vue.js的axios二次封装(点击跳转),这次是uni-app,uni-app是基于vue.js框架的,我觉得是很好用的一个框架,而且一套代码编译那么多平台,非常节省成本,当然, ...

  10. WireShark——IP协议包分析(Ping分析IP协议包)

    互联网协议 IP 是 Internet Protocol 的缩写,中文缩写为“网协”.IP 协议是位于 OSI 模型中第三层的协议,其主要目的就是使得网络间能够互联通信.前面介绍了 ARP 协议, 该 ...