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. HttpUtil工具类，发送Get/Post请求，支持Http和Https协议

    HttpUtil工具类,发送Get/Post请求,支持Http和Https协议 使用用Httpclient封装的HttpUtil工具类,发送Get/Post请求 1. maven引入httpclien ...

  2. 一次性搞懂 PHP 中面向对象的所有知识点。

    OOP是什么? OOP是面向对象编程,面向对象编程是一种计算机编程架构. OOP的基本原则是计算机程序是由单个能起到子程序作用的单元或对象组合而成. 基本概念: 类:定义了事务的抽象特点.包含了数据的 ...

  3. 环境篇：呕心沥血@CDH线上调优

    环境篇:呕心沥血@线上调优 为什么出这篇文章? 近期有很多公司开始引入大数据,由于各方资源有限,并不能合理分配服务器资源,和服务器选型,小叶这里将工作中的总结出来,给新入行的小伙伴带个方向,不敢说一定 ...

  4. php使用json_encode中遇见问题？

    注:php版本5.4下,不支持json_encode对中文的处理,要么升级php版本. json_encode($value,$options) 其中有2个比较常用到的参数: 1.JSON_UNESC ...

  5. eclipse Luna 安装SVN插件

    Help--->Install New Soft ----> 输入 “Luna - http://download.eclipse.org/releases/luna” 这里显示都是 lu ...

  6. 线上服务的FGC问题排查，看这篇就够了！

    线上服务的GC问题,是Java程序非常典型的一类问题,非常考验工程师排查问题的能力.同时,几乎是面试必考题,但是能真正答好此题的人并不多,要么原理没吃透,要么缺乏实战经验. 过去半年时间里,我们的广告 ...

  7. 2019-02-02 Python学习之多线程

    1.主线程和次线程 若主线程结束则次线程也会结束 如何避免主线程先结束: 结尾处加上 while True: pass e.g. import win32api #引用系统函数 import _thr ...

  8. 大数据之Hudi + Kylin的准实时数仓实现

    问题导读:1.数据库.数据仓库如何理解?2.数据湖有什么用途?解决什么问题?3.数据仓库的加载链路如何实现?4.Hudi新一代数据湖项目有什么优势? 在近期的 Apache Kylin × Apach ...

  9. （九）logback.xml文件配置（按时间、文件大小和log名称生成日志）

    原文链接:https://www.cnblogs.com/hhhshct/p/9084036.html rollingPolicy 设置:<rollingPolicy class="c ...

  10. 操作-写入excel

    xlwt模块 封装 #!/usr/bin/env python # -*- coding: utf-8 -*- import xlwt import xlrd from xlutils.copy im ...