HTML页面顶部出现空白部分（#65279字符?）解决办法

1、在火狐下面用Firebug，选择body，点编辑html的时候，看到是多出了一个这个代表的意思，还真不知道，搜索后了解到是一种中文的编码规则，

 

UTF-8不需要BOM来表明字节顺序。

 

制作模板用的是dreamweaver，编码用的就是utf-8，于是在页面属性->标题/编码中，把Unicode签名(BOM)去掉，重新生成后，空白行没有了。

 

2、专门针对PHP

 

使用PHP拼接HTML页面，页面顶部出现小段空白，其实是UTF-8有BOM编码导致的，只需另存为无BOM格式即可解决。

 

而且只会在chrome和edge浏览器出现，ff则不会出现这个问题。由于该页面是由PHP+HTML模板拼接接，因此先后排查了html文件、JavaScript文件、php文件。均未发现问题。

 

使用chrome F12发现空白处是一串&#65279字符。通过搜索，了解到这原来是UTF-8的编码问题。

 

我使用的编码是UTF-8 + BOM，这种编码方式一般会在Windows操作系统中出现，比如Windows自带的记事本等软件，在保存一个以UTF-8编码的文件时，会在文件开始的地方插入三个不可见的字符（0xEF 0xBB 0xBF，即BOM）。它是一串隐藏的字符，用于让记事本等编辑器识别这个文件是否以UTF-8编码。对于一般的文件，这样并不会产生什么麻烦。但对于 PHP来说，BOM是个大麻烦。因为PHP并不会忽略BOM，所以在读取、包含或者引用这些文件时，会把BOM作为该文件开头正文的一部分。根据嵌入式语言的特点，这串字符将被直接执行（显示）出来。

 

知道问题的原因之后，便很好解决了。我使用的是 phpstorm，在菜单栏文件里有“remove bom”选项，可以直接存为UTF-8无BOM模式。如果使用notepad++或其他工具的也可以选择“另存为”，然后在编码那儿选择“UTF-8无BOM”即可解决。   

 

***

扫描二维码，关注web全栈开发工程师，获取最新最全的全栈开发内容