html 提供了 5 种空格实体 (space entity), 它们拥有不同的宽度, 非断行空格( ) 是常规空格的宽度, 可运行于所有主流浏览器. 其他几种空格 ( ) 在不同浏览器中宽度各异.
它叫不换行空格, 全称 No-Break Space, 它是最常见和我们使用最多的空格, 大多数的人可能只接触了 , 它是按下 space 键产生的空格. 在 HTML 中, 如果你用空格键产生此空格, 空格是不会累加的(只算 1 个). 要使用 HTML 实体表示才可累加, 该空格占据宽度受字体影响明显而强烈.
它叫 "半角空格", 全称是 En Space,en 是字体排印学的计量单位, 为 em 宽度的一半. 根据定义, 它等同于字体度的一半(如 16px 字体中就是 8px). 名义上是小写字母 n 的宽度. 此空格传承空格家族一贯的特性: 透明的, 此空格有个相当稳健的特性, 就是其占据的宽度正好是 1/2 个中文宽度, 而且基本上不受字体影响.
它叫 "全角空格", 全称是 Em Space,em 是字体排印学的计量单位, 相当于当前指定的点数. 例如, 1 em 在 16px 的字体中就是 16px. 此空格也传承空格家族一贯的特性: 透明的, 此空格也有个相当稳健的特性, 就是其占据的宽度正好是 1 个中文宽度, 而且基本上不受字体影响.
它叫窄空格, 全称是 Thin Space. 我们不妨称之为 "瘦弱空格", 就是该空格长得比较瘦弱, 身体单薄, 占据的宽度比较小. 它是 em 之六分之一宽.
它叫零宽不连字, 全称是 Zero Width Non Joiner, 简称 "ZWNJ", 是一个不打印字符, 放在电子文本的两个字符之间, 抑制本来会发生的连字, 而是以这两个字符原本的字形来绘制. Unicode 中的零宽不连字字符映射为 ""(zero width non-joiner,U+200C),HTML 字符值引用为:
它叫零宽连字, 全称是 Zero Width Joiner, 简称 "ZWJ", 是一个不打印字符, 放在某些需要复杂排版语言 (如阿拉伯语, 印地语) 的两个字符之间, 使得这两个本不会发生连字的字符产生了连字效果. 零宽连字符的 Unicode 码位是 U+200D (HTML: : ).
一个人学习会有迷茫, 动力不足. 这里推荐一下我的前端学习交流群: 731771211 , 里面都是学习前端的, 如果你想制作酷炫的网页, 想学习编程. 自己整理了一份 2019 最全面前端学习资料, 从最基础的 HTML+CSS+JS[炫酷特效, 游戏, 插件封装, 设计模式] 到移动端 HTML5 的项目实战的学习资料都有整理, 送给每一位前端小伙伴, 有想学习 web 前端的, 或是转行, 或是大学生, 还有工作中想提升自己能力的, 正在学习的小伙伴欢迎加入学习.
来源: http://www.jianshu.com/p/389269b8e606