在微信公众平台，一条可读性高、有吸引力的图文素材，需要内容句句干货，现在的读者对一篇文章的需求越来越高，这就需要苦逼的微信运营者绞尽脑汁的做出更多的编辑效果来吸引读者的眼球，在上一篇经验中已经讲解如果微信公众号图文怎么编辑圆角的彩色背景，下文将讲述微信公众号图文集编辑中怎么设置多色直角背景（附效果图）。工具/原料more微信公众账号Macromedia Dreamweaver软件（文中都简称为DW）一款测试效果的浏览器一颗勇于探索的心方法/步骤1/9分步阅读

打开Macromedia Dreamweaver软件（后文均简写为DW）

2/9

这是做测试写好的代码，现在已经在DW中打开多色直背景效果。

上一条百度经验中为网友方便，写了赤橙黄绿青蓝紫7个颜色效果，这个步骤不再举多个颜色的例子，但是会告诉网友朋友怎么写出你想要的颜色。

朋友，可以拷贝下一个步骤的代码到你的软件。

3/9

meta http-equiv=Content-Type content=text/html; charset=utf-8 /【这一段加粗的代码不要忘记，否则浏览器测试的时候会显示乱码·粘贴代码后这一行斜体字删除】 pspan style=border:0px;margin:0px;padding:6px 10px;color:#ffffff;background-color:#006600;微信公众号图文编辑-多色直角背景/span/ppnbsp;/p pspan style=border:0px;margin:0px;padding:6px 10px;color:#ffffff;background-color:#222222;微信公众号图文编辑-多色直角背景/span/ppnbsp;/p pspan style=border:0px;margin:0px;padding:6px 10px;color:#ffffff;background-color:#cd0000;微信公众号图文编辑-多色直角背景/span/ppnbsp;/p p style=border:0px;padding:0px;color:#333333;letter-spacing:0.25px;line-height:28px;font-family:helvetica, #39;microsoft yahei#39;, #39;hiragino sans gb#39;, sans-serif;font-size:14px;background-color:#ffffff;margin-top:15px;margin-bottom:15px;直接选择需要的样式拷贝到需要的地方，修改其中的文字即可 /p

4/9

现在看一下在浏览器下预览出来的网页效果

5/9

网友朋友，是不是还没有忘记我们还要自己添加需要的背景颜色呢？复制这段红色背景的代码做例子吧！

pspan style=border:0px;margin:0px;padding:6px 10px;color:#ffffff;background-color:#cd0000;微信公众号图文编辑-多色直角背景/span/ppnbsp;/p

6/9

修改这一段代码中的“background-color:#cd0000”为“background-color:#FF00FF”，或者任何你需要的颜色，效果就出来了

7/9

再次看一下在浏览器下的预览效果

8/9

此时此刻，你可以淡定的拷贝预览下的内容，粘贴到你的微信公众平台的图文编辑处了，我们来看一下图文编辑框中的效果

9/9

直接选择需要的样式拷贝到需要的地方，修改其中的文字即可！

Now，你已经拥有了微信公众号图文编辑的多色直角背景，任由自己发挥做出你想要的效果吧！

注意事项

这一段加粗的代码放在样式代码前边，否则浏览器测试的时候会显示乱码

选择需要的样式拷贝到需要的地方，修改其中的文字为自己的文字

公众多色直角