前端编码中快速填充内容--乱数假文

写前端页面的时候,如果要快速插入图片,可以使用 https://picsum.photos/

详见笔者这篇博文:

工具网站:随机生成图片的网站-CSDN博客

可是,如果要快速填充文字内容该怎么做呢?

以前,我们都是写"实例文字"。如,要在一个div里填充文本,我们可能会这样写。

html 复制代码
<div>
实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字实例文字
</div>

这种方式虽然方便,但是文字效果看上去还是太单调了,而且如果对文字字数有要求,还要考虑文字的个数。

不过,有了 VSCode 之类的编辑器,就方便多了,可以快速填充文本,即使用"乱数假文"。

乱数假文,是指一篇常用于排版设计领域的

文章。主要的目的为测试文章或文字在不同字型、版型下看起来的效果。

其文本没有任何实际的意义,就是为了看排版效果的。

在代码里使用乱数假文很简单,在VScode、webstorm、HBuilder之类的现代编辑器中,直接输入 lorem 或者 lorem<字数> 按下 tab 或者 enter,即可快速生成文本。

html 复制代码
lorem

生成的文本效果:
Lorem ipsum dolor sit amet consectetur adipisicing elit. Repudiandae vitae libero dolor odit dicta debitis ullam corrupti iure? Distinctio ab velit sunt accusamus incidunt deleniti in quod blanditiis nesciunt earum?
html 复制代码
lorem20

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Tempora ratione odit earum, similique repellat fugit aperiam. Officiis aspernatur voluptas sunt.

如果要输入中文的乱数假文呢?

在VScode里,可以安装中文假文插件 Chinese Lorem。

输入 jw 或者 jw<数字> 即可快速生成中文假文。

html 复制代码
jw

明同是人者皇陀非语国馆见的丰藏王落志,之了上后是有有才非韩以会融也也未,能守不普,绝一低乐那疾承憾远但是嗣惊的是力韩,台承快拆可事日尝足都德,有王司了洞即,未人感,龄想高君词嗣召王联介厄法,二三而准们但不,拾老得小作在喜你服量,生区他活认有洪订逝问未,我。
html 复制代码
jw20

谭绪恶羊派弟,秦令着准尝,风有若玉死们。

感觉是不是填充网页内容方便多了???

相关推荐
2501_9159184115 分钟前
Web 前端可视化开发工具对比 低代码平台、可视化搭建工具、前端可视化编辑器与在线可视化开发环境的实战分析
前端·低代码·ios·小程序·uni-app·编辑器·iphone
程序员的世界你不懂1 小时前
【Flask】测试平台开发,新增说明书编写和展示功能 第二十三篇
java·前端·数据库
索迪迈科技1 小时前
网络请求库——Axios库深度解析
前端·网络·vue.js·北京百思可瑞教育·百思可瑞教育
gnip1 小时前
JavaScript二叉树相关概念
前端
attitude.x2 小时前
PyTorch 动态图的灵活性与实用技巧
前端·人工智能·深度学习
β添砖java2 小时前
CSS3核心技术
前端·css·css3
空山新雨(大队长)2 小时前
HTML第八课:HTML4和HTML5的区别
前端·html·html5
猫头虎-前端技术3 小时前
浏览器兼容性问题全解:CSS 前缀、Grid/Flex 布局兼容方案与跨浏览器调试技巧
前端·css·node.js·bootstrap·ecmascript·css3·媒体
阿珊和她的猫3 小时前
探索 CSS 过渡:打造流畅网页交互体验
前端·css