微信文章排版htmlcss手把手教你微信排版的进阶之道

打开Chrome浏览器，上岸微信"大众平台后台，开始进阶练习吧！
点击链接查看本期课程Demo。

1、在微信"大众平台新建文章

在微信"大众年夜众平台录入一篇新的文章后，点击“保存”（除了分段，不要进行任何格式处理）。
然后在后台的“素材管理”中，点击新建文章的标题即可浏览文章。

微信文章排版htmlcss手把手教你微信排版的进阶之道 Python

2、打开Chrome浏览器的审查元素功能

在浏览器打开文章后，选中所需修正格式的笔墨，右击鼠标打开“审查元素”。

3、利用CSS代码调度微信排版

打开“审查代码”窗口后，对准在所须要调度格式的标签后，右击鼠标选择“Edit as html”即可添加内嵌样式，把稳：不同的样式属性插入style=””的两个英文“”之间，并且不同的样式属性要用英文分号;隔开，如：

标题一的处理

在Demo文章中，我为标题1做了如下的处理，完全的代码为：这里是你的标题一笔墨。

修正标题一段落背景色为#fdfcfc（灰色），对应的代码为：。
在css中，你利用类似white、gray的颜色单词、rgb颜色值或者二进制的颜色值都是可以的。
（快捷获取颜色值，可拜会伟仔如何获取图片上某一点的颜色值或利用Picnik取色网站）

为标题一段落增加一个2px厚、颜色值为#e6a117的实色上边框，对应的代码：。
如果你要增加为全边框，只须要变成boder即可，如果”向下/向左/向右“的方向边框，将border-top修正为boder-bottom/boder-left/boder-right即可;

修正标题一文本背景色为#e6a117（半撇黄），对应的代码为。
在这里标签是掌握整段文本，是掌握详细的单词或句子，也便是标题一的笔墨有多少，背景颜色就覆盖多少。

修正标题一文本质彩为white（白色），对应的代码为。

修正标题内边距为5个像素，对应的代码为。
之以是在标签增加padding，是为让文本的添补颜色刚好覆盖住标题一段落的灰色背景。

正文的处理

在Demo文章中，我分别为正文做了如下的处理，完全代码为：这里是你的段落笔墨。

修正正文段落字体颜色为gray（灰色），对应的代码为：

修正正文段落左内边距为10个像素，对应的代码为：。

为正文段落增加一个2px厚、灰色实色左边框，对应的代码为：。
这种效果类似mardown中引用样式。

修正排版后，选中并复制格式内容，再粘贴到微信的后台文章即可运用了，这个技巧可以让你复制微信文章上许多排版精良的文章，比如“炒客”"大众年夜众号，至于如何检索微信文章，你可以访问：如何利用搜索技巧检索微信公众年夜众平台文章。

在微信排版中，或者说是网页排版中，常见的样式属性紧张有包括：边框（border）、颜色（color）、背景（background）、字体大小（font-size）、对齐办法（text-align）、内边距（padding）、外边距（margin），还有加粗（font-weight:bold），倾斜（font-style:italic），这两个属性直接在编辑器中操作就可以了。

为了方便演示处理技巧，在本次课程中我尽可能的增加样式的种类，但是在实际排版中，还是该当根据公司的UI主辅色，越简洁越好，毕竟正文才是内容的核心。

当然，你可以利用在线的HTML编辑器编辑后再复制到微信后台，也可以利用强大的CSS掌握网页排版，本文也只是抛砖引语，如果你想学习更多CSS排版技巧，可以到w3c的官网学习。