UTF-8与UTF-8无BOM的差异导致的异常

来自:互联网
时间:2018-08-13
阅读:

UTF-8 无BOM格式

UTF-8 BOM又叫UTF-8 签名,其实UTF-8 的BOM对UFT-8没有作用,是为了支援UTF-16,UTF-32才加上的BOM,BOM签名的意思就是告诉编辑器当前文件采用何种编码,方便编辑器识别,但是BOM虽然在编辑器中不显示,但是会产生输出,就像多了一个空行。

记事本修改后保存的php文件只是UTF-8编码,但是一般来说,php是不支持有BOM的,php文件应该保存为UTF-8无BOM类型, 而Windows记事本的UTF-8是有BOM的,这就会造成错误。所以,文件存储时格式一般选择UTF-8无BOM格式

典型的是制作WordPress主题时,直接粘贴代码的正常,如果从sidebar.php调用过来,很可能在IE6,7浏览器中出现空行,解决办法是用Notepad++打开sidebar.php文件,格式-选择“UTF-8无BOM格式编码”。

很少见的一种情况

有时候2个完全一样的代码,且没有涉及到IE6的bug问题,但是在火狐浏览器和IE6,7浏览器的显示效果就不同。代码没办法发上来,只要在浏览器中格式化过,那么他们就是真正的“完全一模一样了”,请看示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>2个块级元素到低有何不同?</title>
<style type="text/CSS">
.contAIner{
    width:600px;
    margin:10px auto;
    background:#FCC;
    overflow:hidden;
    zoom:1;
}
.content{
    width:300px;
    height:200px;
    float:left;
    border:1px solid #f00;
}
.sidebar{
    width:280px;
    height:200px;
    float:right;
    border:1px solid #00f;
}
</style>
</head>
<body>
<div class="container">
    <div class="content"></div>
    <div class="sidebar"></div>
</div>
<div class="container">
    <div class="content"></div>
    <div class="sidebar"></div>
</div>
</body>
</html>

在IE6,7和火狐浏览器显示的是不同的,我用Beyong Compare比较了下,发现是以下的2个代码有差异

<div class="sidebar"></div>

2个container中都有上面的代码,但看上去完全一样,到底差异在哪呢?我一个个删除字符,最后发现2个代码的差异在于<div开头的这个“<”把上面的“<”复制到下面,问题就解决了。原因到目前未明,非常奇怪的差异化。解决这类问题的办法只有用Beyong Compare软件进行文本对比,用正确的替换不同的部分。

返回顶部
顶部