微信公众号排版高级技巧（用代码做高逼格微信公众号排版）

上图参考了公众号“真格基金”的文章导航，由CSS代码编写完成。

目前微信公众号的文章导航大致分两种：图片和代码

采用图片的好处是方便快捷，一键上传；劣势则体现在画质可能受损，广经流传后变得模糊不清，而CSS代码则解决了这个问题！

下面分享“真格基金”的内容导航，并附上源码及操作方法。

> 真格基金 内容导航

> 内容导航源代码：

<table data-sort="sortDisabled" align="center" width="592" style="margin-top: 0px; margin-right: 0px; margin-left: 0px; padding: 0px; font-family: &quot;Helvetica Neue&quot;, Helvetica, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, Arial, sans-serif; font-size: medium;">

<tbody style="margin: 0px; padding: 0px;">

<tr class="firstRow" style="margin: 0px; padding: 0px;">

<td align="center" valign="middle" width="192" style="margin: 0px; border-color: rgb(255, 255, 255); background-color: rgb(244, 242, 235);">

<span style="margin: 0px; padding: 0px; font-size: 14px;">

<strong style="margin: 0px; padding: 0px;">

<span style="margin: 0px; padding: 0px; color: rgb(128, 78, 33);">真格动态</span>

</strong></span>

</td>

<td align="center" valign="middle" width="168" style="margin: 0px; border-color: rgb(255, 255, 255); background-color: rgb(244, 242, 235);">

<span style="margin: 0px; padding: 0px; line-height: 22.4px; color: rgb(201, 188, 156); font-size: 14px;">真格课堂</span>

</td>

<td align="center" valign="middle" width="158" style="margin: 0px; border-color: rgb(255, 255, 255); background-color: rgb(244, 242, 235);">

<span style="margin: 0px; padding: 0px; line-height: 22.4px; color: rgb(201, 188, 156); font-size: 14px;">真格故事</span>

</td>

<td align="center" valign="middle" width="154" style="margin: 0px; border-color: rgb(255, 255, 255); background-color: rgb(244, 242, 235);">

<span style="margin: 0px; padding: 0px; line-height: 22.4px; color: rgb(201, 188, 156); font-size: 14px;">真格分享</span>

</td>

</tr>

<tr style="margin: 0px; padding: 0px;">

<td rowspan="1" colspan="4" align="center" valign="middle" style="margin: 0px; border-color: rgb(255, 255, 255); background-color: rgb(244, 242, 235);">

<span style="margin: 0px; padding: 0px; color: rgb(128, 78, 33); font-size: 14px;"><strong style="margin: 0px; padding: 0px;">这里有关于真格的一切。</strong></span><span style="margin: 0px; padding: 0px; color: rgb(128, 78, 33);"><strong style="margin: 0px; padding: 0px;"><br style="margin: 0px; padding: 0px;"/></strong></span>

</td>

</tr>

</tbody>

</table>

> 修改文字方法：

1.请使用电脑访问网站 新媒体排版

2.点击 源代码工具，复制上方源码进内容框

3.删除源代码中的文字部分，填写上所需设置的文字（建议每个栏目不超过4个字）

> 修改颜色方法：

- 修改背景色：

<td align=...>中，修改“background-color:”后的代码为指定颜色，如“#000”；

- 修改字体色：

<span style=...>中，修改“color:”后的代码为指定颜色，如“#000”；

修改完成后，点击源代码工具，你想要的就在那里了！只需复制到微信编辑器，你的内容导航就可以做好发布啦！

订阅头条号新媒体学徒

每周一到周五连载更新

,