—原创教程 @刘健亮 出品—–
微信平台经常需要发布些图文消息，如何利用微信简单的编辑系统进行推送内容的排版，是很多微信君必须面对的问题。
（一）你有意识段落设计吗？
一个没有态度的微信君在编辑文本段落时，可能是直接复制的文本，也有可能是键盘直接敲打出来的文本。
如果你能在段首敲打2个空格（输入法全角状态），你可以实现首行缩进。如果你能在段尾打个ENTER回车键，那么段落之间结构会很分明。
微信中既然提供有序列表和无序列表功能，说明列表功能还是很实用的。
- 项目一
- 项目二
- 项目三
如果有排版需要，段落格式（鼠标右击会出现菜单）中的左对齐、右对齐、居中对齐、两端对齐可以应用。
（二）你想成为高手吗？
如果你用过html中<blockquote>标签、并且懂一点CSS基础的话，那么你可以设计出高富帅的效果。
举些栗子
▷ 高富一：
雷锋网努力做好移动互联网的三个代表，代表移动互联网未来发展的方向，代表移动互联网的颠覆创新思潮，代表移动互联网创业者和从业者的利益。
▷ 高富二：
雷者，万钧之势；锋者，锐利之芒；雷锋网与正在爆发的移动互联网革命同生同息，与越来越多投身这个行业的创业者和从业者共成雷霆之景，锋芒之相。
▷ 高富三：
联系作者：@刘健亮 （新浪微博）
效果怎么实现的呢？给高手点拨下，给<blockquote>设置CSS样式，比如border、color、background-color、padding等。在网页制作工具或其他地方设置好样式，再复制文本，文本的样式就会跑到微信中来啦！
考虑到有人听不明白，下面详细讲下这三个高富帅效果吧。
⊙ 高富一剖析：
<blockquote style=”padding:0px 20px;border-left:5px solid #c9c9c9;”>雷锋网努力做好移动互联网的三个代表，代表移动互联网未来发展的方向，代表移动互联网的颠覆创新思潮，代表移动互联网创业者和从业者的利益。</blockquote>
你不需要知道<blockquote>标签是什么意思，英文style暗示后面的代码是设置样式用的。“padding:0px 20px”作用是设置左边距为20px,”border-left:5px solid #c9c9c9;”意思是设置左边框，边框的粗细为5px，样式为实线（高富三样式为点状，dashed），边框颜色为#c9c9c9。关于文字的颜色就必要在代码中声明了，在微信中即可修改。
代码写好后怎么使用呢？不是直接复制微信就可以使用的，我们需要在其他地方把网页效果显示出来，再把文字复制到微信即可，而此时的文本保留了CSS样式。一个完整html的文件具有相应的格式，完整代码如下：
<html>
<head>
</head>
<body>
教程制作：@刘健亮
<blockquote style=”padding:0px 20px;border-left:5px solid #c9c9c9;”>雷锋网努力做好移动互联网的三个代表，代表移动互联网未来发展的方向，代表移动互联网的颠覆创新思潮，代表移动互联网创业者和从业者的利益。</blockquote>
转载请注明作者
</body>
</html>
你只需把上方红色的文本复制到记事本，并保存为文件名.html形式，然后通过浏览器打开即可看到效果：
全选复制网页中所有东西在微信中黏贴，便修改成自己的效果，高富帅效果就诞生啦！
⊙ 高富二剖析：
高富二与高富一主要区别是四周都有边框，把border-left改成border即可。
完整代码如下：
<html>
<head>
</head>
<body>
教程制作：@刘健亮
<blockquote style=”padding:0px 20px;border:2px solid #c9c9c9;”>雷者，万钧之势；锋者，锐利之芒；雷锋网与正在爆发的移动互联网革命同生同息，与越来越多投身这个行业的创业者和从业者共成雷霆之景，锋芒之相。</blockquote>
转载请注明作者
</body>
</html>
⊙ 高富三剖析：
高富三的边框样式为点状dashed，而非实线solid，另外添加了背景颜色：background-color:#116D8A；
完整代码如下：
<html>
<head>
</head>
<body>
教程制作：@刘健亮
<blockquote style=”padding:0px 20px;border:2px dashed #c9c9c9;background-color:#116D8A;”>联系作者：@刘健亮 （新浪微博）</blockquote>
转载请注明作者
</body>
</html>
大家可以动手操作起来，也可以尝试修改其它参数，有什么不懂的可以微博联系@刘健亮
下一期预告
05期 微信排版教程之大有用图
–【微信排版教程目录索引】–
| 期数 | | 文章标题 |
| 01期 | | 微信排版进阶教程 |
| 02期 | | 微信排版教程之字得其乐（一） |
| 03期 | | 微信排版教程之字得其乐（二） |
| 04期 | | 微信排版教程之高手有段 |
| 05期 | | 微信排版教程之大有用图 |
| 06期 | | 微信排版教程之表里如一 |
点击阅读原文可关注@刘健亮 微博
