各浏览器之间,空格符占位大小不一的处理办法

品味人生 • 发布于 2019-02-01 21:37:02

这个家伙很害羞,不想介绍自己!

昨天有一位朋友问到我,为什么不同浏览器之间,空格所占的宽度不一。不断的跟我抱怨,说已经尝试了许多种办法,都无法解决这个问题。

其实这个问题算不上是什么浏览器BUG;这是因为各浏览器之间,设置的默认字体不同造成的。

例如:IE的字体多数是采用宋体为默认字体,如:IE6,IE7,IE8.IE9使用什么字体暂时没测试过。像谷歌浏览器,欧鹏,火狐,safari等,这些浏览器多数会采用微软雅黑 这种黑体系字体。

所以我们要解决这个问题,就需要给页面设置默认字体,对body的样式默认设置为一种字体,以解决各浏览器之间字体不一导致的空格长度不一的情况。

思路已经明确了,下面我们要开始解决问题了。

首先我们要在body下设置 font-family样式,为其设置中文字体和英文字体。为什么要设置两种字体呢?因为有时候输入内容时,会使用英文空格,有时候是中文空格.

至于中文字体和英文字体使用什么字体就随个人喜好咯。