怪异空格引发的血案

在整理博客的过程中发现博客内有部分地方没有对齐。于是赶紧打开devtool看下。结果发现了神秘而怪异的现象。明明没有打空格的地方,却出现了实体 真的是着了魔般,怎么都干不掉。

二维码和下面的文字没有对齐,查看后发现图片没对齐

第一反应是css出了问题,于是打开devtool试着调试css。结果,怎么搞都没办法。仔细去看HTML,发现出现了两个 。

可是我很清楚,这地方源码里面没有空格啊。于是想到自己的网页是经过ob content输出的,是不是php处理上出了什么问题,然后去翻开插件看,可是怎么读代码,都觉得应该不是这个问题。

于是又去看下网页源代码,怪异的事情发生了,明明网页源代码里面没有 啊。

难道是\t的问题?于是把源码中的这个地方删掉重新换行,结果,仍然还是这个问题。直到我开启了vscode的空格显示功能,才发现了异样。

你仔细看<img>前面的空格,发现这两个空格的宽度感觉很奇怪。于是删掉,自己打了两个空格,问题解决了。

正常的空格[ ],奇怪的空格[   ],请查看源码和在devtool中查看。

原来这两个空格是全角空格,也就是中文格式下的特殊字符。但是,这个空格在键盘上是打不出来的,要通过特殊的输入方式才能打出来,这是怎么产生的呢?我不可能写代码的时候,还这样去特意打两个全角空格吧。最后,看来是在不同的系统切换,不同的环境下,切换编辑时,留下的问题。

已有4条评论
  1. Betty 2018-09-30 11:28

    你这个情况,我博客上也有,不过仅限 Mac 和部分 Windows 之间。
    比如我明明正常输入的一句话,在某些 Windows 下会看到句子里出现类似+号的奇怪字符。
    自己的Win 8.1 和 公司的 Win 10下会看到,但有的读者说他们并没有看到,所以也不知道是什么机制了。

    • 否子戈 2018-09-30 11:32

      上班时间逛博客,小同学,需求不包含啊😝

      • Betty 2018-09-30 11:36

        上班时间回评论,大同学,你需求不包含啊

        我是今天休假了,要对自己好一点,哈哈哈

        • 否子戈 2018-09-30 11:44

          提前休假真爽啊,岂不是要出去浪了