本站承诺永不接任何虚假欺骗、联盟广告、弹窗广告、病毒广告、诱导充值等影响用户体验的广告,广告屏蔽插件会影响本站部分功能,还请不要屏蔽本站广告,感谢支持!

当前位置:首页 / 正文

2019-10-30 | 编程技术 | 2742 次阅读 | 等你评论 | 2 次点赞 | 繁体

汉学家称这个空白字元为「盘古之白」,因为它劈开了全形字和半角字之间的混沌。另有研究显示,打字的时候不喜欢在中文和英文之间加空格的人,感情路都走得很辛苦,有七成的比例会在34岁的时候跟自己不爱的人结婚,而其余三成的人最后只能把遗产留给自己的猫。毕竟爱情跟书写都需要适时地留白。

虽然不知道这是不是真的,不过在中英混排时加上空格的话看起来确实要舒服不少,知乎(https://www.zhihu.com/question/19587406)上关于这个问题的讨论也不少。

不过作为强迫症,在中英文之间加上空格还是很有必要的,但是自己写文章时还可以这么做(如果你愿意一个一个加的话),在浏览网页时可就没办法了。并且就算是自己在写博客时也不会考虑那么多吧!

于是乎,万能的GitHub找到了这个:http://github.com/vinta/pangu.js

其实这是一个不错的解决方案,不仅可以自己在网站中插入脚本来达到加空格的效果,还可以使用Chrome插件使得访问所有网站都会自动加上空格。

虽然看起来确实不错,但是还是有缺点的。自动加上的空格会被选中,使得复制时也会被带上。虽然看上去没有什么问题,可是如果是在网站URL中加上了空格反而会造成麻烦。如果是在代码中加上了空格,还可能会造成一定的后果。

所以还是另找办法吧

然后发现了这个:http://github.com/mastermay/text-autospace.js

空格不会被自动选中,并且已手动添加了空格的不会再次添加。

下面是演示(可按Ctrl+A查看效果):
不含空格的:究竟在Win10下Chrome浏览器和Edge浏览器哪个快呢?
包含空格的:究竟在 Win10 下 Chrome 浏览器和 Edge 浏览器哪个快呢?

为了防止自己忘记还是把使用方法贴一份吧:
(这里以Typecho作示范,其他类型的网站照猫画虎就行了)

1、先上传js,然后在博客主题header.php或footer.php中引入:

<script src = "<?php $this->options->themeUrl('js/text-autospace.min.js'); ?>"></script>

2、添加以下css,可以在主题css中修改或另行引入:

html.han-la hanla:after {
    content: " ";
    display: inline;
    font-family: Arial;
    font-size: 0.89em;
}
html.han-la code hanla,
html.han-la pre hanla,
html.han-la kbd hanla,
html.han-la samp hanla {
    display: none;
}
html.han-la ol > hanla,
html.han-la ul > hanla {
    display: none;
}

3、最后修改<html>标签,添加class="han-la":

<html lang="zh-CN" class="han-la">

这时候刷新一下网页,你会发现中英文之间被自动加上空格了。

via:https://beyang.cc/experience/text-autospace.html

标签: javascripthtml

猜你喜欢
Typecho纯代码生成sitemap站点地图
想要实现 Typecho 纯代码生成 sitemap 站点地图只需要 2 步就够了。1、在博客主题目录新建 sitemap.php 页面,放入以下代码:<?php /** *HTML版网站...
Lazysizes.js图片懒加载的使用
lazysizes 是一种快速(无垃圾),对 SEO 友好且可自动初始化的 lazyloader,用于图像(包括响应图像 picture/ srcset),iframe,脚本/小部件等。它还通过...
通用的检测到广告屏蔽插件进行弹窗提示实现方法
用的 js 方法来检测,按理说所有博客都能使用,就是在打开网页的时候进行一次判断。如果发现没有加载广告代码,就会出来一个弹窗来提示浏览者将本站加到广告拦截插件的白名单里面。别喷我,个人站长经营实...
javascript | 原生JS多语言切换简单实现
由于项目需要实现一个前端的多语言切换,不想因为一个简单的功能就引入 jQuery,所以经过 google 编程大法摸索出一个原生 JS 就可以实现的多语言前端切换的小例子,仅供参考。<bo...
原生js实现ajax方法
由于不想多引入一个 jquery,百度了一个原生 js 实现 ajax 的方法(超简单),挺不错的,现在就分享给大家,也给大家做个参考。首先新建一个 js 文件:function ajax(){...
NUC8黑苹果更新OpenCore引导教程
鉴于本人的苹果笔记本年代久远,又想用最新的系统,所以早早就入手了 NUC8,并且成功安装了 macOS,使用 OC 引导,由最初的 macOS Catalina 10.15.7 陆续升级到了 macO
(首次提交评论需审核通过才会显示,请勿重复提交)