/ 代码 / 246浏览

“空格爱好者”插件改进

喜欢在中英文间插入空格的博主都知道,WP有一款插件叫“空格爱好者”(Space Lover),由软件作者Tunghsiao Liu编写。整体代码简洁明了,以preg_replace与正则表达式来判断和添加中英文间的空格,达到悦目的效果。

当然插件也不是完美无缺,毕竟自动插入空格后会导致复制文本时带入额外空格,以及中英文间的空格过宽且无法单独自定义。

还有个偷懒办法是直接设置letter-spacing: 0.15rem,但所有文本都相应宽了。

改进方法:

  • 正则表达式将' '替换为'<span class="space"></span>'
  • CSS中设置.space {margin:0 0.1rem;}

代码举例:

$content = preg_replace('~(\p{Han})([a-zA-Z0-9\p{Ps}\p{Pi}])(?![^<]*>)~u', '\1'.'<span class="space"></span>'.'\2', $content);

效果:

WP默认,字间太局促
单独设置letter-spacing,但其它文本字间也宽了
激活插件后中英文间加宽,但带入额外空格,空格过宽且无法单独自定义
插件正则内空格修改为<span class="space">后去除了额外空格且可自定义宽度

注:<span>会出现在浏览器标签页中,有洁癖者慎加。

更新于

26

  1. JiaYin

    太高级了,强迫症很喜欢,但我不会,算了。

    Google Chrome 110 · Windows 10
    1. S

      @JiaYin可以直接装插件不改也挺好。

      Microsoft Edge 110 · Windows 10

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注