像神一样排版

2018-01-08  本文已影响0人  叵好

上周在i排版里推送了两篇文章,分别扒了咪蒙和罗永浩的排版风格,小伙伴们仿佛找到了一扇通往100000+的大门,今天我们来造福更多的朋友。

咪蒙的排版主要是用到了文章缩进、两边留白,老罗的排版主要调整了文字的左右间距。

很多人好奇像咪蒙那种阅读流畅,视觉舒服的排版风格尤其是整篇文章缩进是怎么做出来的,今天沙师弟就来扒一扒最有特色的部分。

我们i排版(iPaiban)在去年5月份就推出了“缩进”功能,图片文字缩进一键搞定!

i排版为大家提供了5种规格的缩进效果——从0.5个字符到4个字符,大家可以根据自己的需求来选择;如果不需要缩进了,选择“0”字符或者清除格式就好,图片也是相同的道理。

下面i排版为大家展示几枚栗子:

同时缩进0.5个字符

我们整天忙忙碌碌,像一群群没有灵魂的苍蝇,喧闹着,躁动着,听不到灵魂深处的声音。时光流逝,童年远去,我们渐渐长大,岁月带走了许许多多的回忆,也消蚀了心底曾今拥有的那份童稚的纯真,我们不顾心灵桎梏,沉溺于人世浮华,专注于利益法则,我们把自己弄丢了。

我们整天忙忙碌碌,像一群群没有灵魂的苍蝇,喧闹着,躁动着,听不到灵魂深处的声音。时光逝,童年远去,我们渐渐长大,岁月带走了许许多多的回忆,也消蚀了心底曾今拥有的那份童稚的纯真,我们不顾心灵桎梏,沉溺于人世浮华,专注于利益法则,我们把自己弄丢了。

使用缩进这一功能时,光标在哪一段就会缩进哪一段;如果想全部缩进,通过ctrl+A全选,再点缩进,就可以全文缩进了。根据老司机的体验,缩进1-2个字符是最好看的,3-4个字符就基本是极限了,内容太过瘦长也影响美观的。

如果不想使用缩进效果了,选择缩进中的“0”字符就好,也可以通过“一键清除”按钮和缩进效果say goodbye。

不过,需要注意的是,目前缩进效果仅针对文字和图片内容,部分使用了样式的内容是不支持缩进的。

如果你稍微懂点代码的话,还可以用i排版的“HTML”工具任意调整缩进内容的字符大小。

咪蒙文章排版大家问的最多的就是缩进功能,现在也都讲完了,今天的排版就用起来,让用户和领导眼前一亮。接下来我们扒一扒老罗的调整文字左右间距的排版。

推文必然是关公赴会——单刀直入,直奔主题正常字间距

微信后台和i排版以及各友商都是默认这种间距

字间距适当加大好像还挺好看,今天赶紧来试一试

字间距缩小

没找到对应的作死文章,随便截下零钱图吧

设置文字左右间距其实和我们常见的设置行高是一样的性质,只不过字间距大家目前用的比较少就没有在工具栏上添加上这一功能。

我们可以通过简单的小代码来实现,调整对应内容的“letter-spacing”的属性就可以。

首先你要记住设置文字左右间距的代码

设置步骤:

 打开i排版(www.iPaiban.com),进入HTML编辑页面,将上面的这串代码复制粘贴到这里。

 替换文字:代码中“需要设置左右间距的文字”可以直接替换、编辑;如果有小伙伴不习惯在代码编辑页面操作,可以切换回正常编辑将自己的内容粘贴到示例文字后面,再删除示例文字,以免出现左右缩进效果丢失的情况。

 设置具体间距:完成文字内容编辑后,还需要调整合适的间距数值,也就是“10px”那里。这个数值可正可负,0就是正常的文字间距,>0则会拉大文字间距,使用负值,文字就会变得紧凑了。

点击一下HTML按钮,就可以在正常编辑框中看到效果啦!(哦,对了忘了说,老罗的字间距设置是1.5px)

设置15px字号小彩蛋:

有人说i排版和微信后台都没有15px大小的字体,相同的道理,改代码,14改成15就好了。

司机领进门,刹车在个人,怎么玩就看你们的了→_→。

上一篇下一篇

猜你喜欢

热点阅读