有很多微信图文形式很新颖,是怎么做到的
发布网友
发布时间：2022-04-26 05:00
共1个回答
热心网友
时间：2022-06-20 22:51
微信公众号的图文编辑样式吧，你说的应该是这个，这些样式一般都是通过微信编辑器进行编辑的，你可以选择一个编辑器也可以编辑出很多的样式，这样图文显得更加的好看，更具有可读性，我经常用的编辑器一般都是小蚂蚁编辑器，他的样式还是很新的，更新的也超级的快，如下图：
如果会使用html代码，可以看看下面的代码使用：
<section class="www.xmyeditor.com" id="xmy1478936141382" ><section>
<section style="display:flex;">
<section style="width:30%!important;" data-width="30%">
<img src="http://ww2.sinaimg.cn/large/006qBWBXjw1f8spigunrcg305j02r746.gif"/>
</section>
<section style="flex:1;text-align: center;">
<section style="">
<img src="http://ww4.sinaimg.cn/large/006qBWBXjw1f8spihpi5mg301500tt8h.gif" style="width: 30px!important;" data-width="30px"/>
</section>
<section class="active brush" style="font-size:16px;color:rgb(6,6,6);">
点击上方<span style="color:rgb(78,147,253);">蓝字</span>关注我们吧
</section>
</section>
</section>
</section>
</section>
<section class="xmyeditor" id="xmy1478936144590" onmouseup="ajh(this.id);">
<section>
<section id="uuu0" class="wxqq-bg" style="width: 100%; border: 1px solid rgb(219, 219, 219); margin: 0px; background-color: rgb(229, 243, 208);">
<img alt="" src="http://ww1.sinaimg.cn/large/006qBWBXjw1f8wd5y2s1wj30ci08cjrw.jpg" style="border-style: solid; border-width: 0px; width: 100%; margin: 50px 0px 0px;"/>
<section data-style="margin: 5px 0px; font-size: 20px; padding: 2px 10px 2px; color: rgb(255, 255, 255); text-align: center; line-height: normal;">
<p style="margin: 5px 0px; padding: 2px 10px; color: rgb(255, 255, 255); text-align: center; line-height: normal;">
<br/><span id="uuu0" style="font-size: 14px; color: rgb(255, 129, 36);">Q W E R T F Y</span>
</p>
<p style="margin: 5px 0px; padding: 2px 10px; color: rgb(255, 255, 255); line-height: normal;">
<span style="font-size: 14px; color: rgb(255, 129, 36);"><br/></span>
</p>
</section>
</section>
</section>
</section>
<section class="xmyeditor" id="xmy1478936151754" onmouseup="ajh(this.id);">
<section>
<section style="text-align:center;margin-top: 7em;">
<section style="background-color:rgb(254,254,254);padding: 26px 20px;display: inline-block;width: auto;transform: rotate(0deg);-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);">
<p style="line-height: 1.5em;">
<span id="uuu0" class="wxqq-Color" style="font-size: 20px; color: rgb(107, 101, 30);"><strong>你好</strong></span>
</p>
<p style="line-height: 1.5em;">
<span id="uuu1" class="wxqq-Color" style="font-size: 20px; color: rgb(107, 101, 30);"><strong>my friends</strong></span>
</p>
</section>
<section style="margin: -14em auto 2em;text-align:center;/* display: inline-block; */">
<section style="width:49%;display:inline-block;margin-top: 8em;">
<section id="uuu2" class="wxqq-Color" style="margin: 15px; line-height: 1.5em; font-size: 14px; color: rgb(107, 101, 30);">
Img
</section><img src="http://ww3.sinaimg.cn/large/006qBWBXjw1f8zn7xw9v4j30ms0f0dkj.jpg" style="width: 100%; margin: 0px; height: auto !important;"/>
</section>
<section style="display:inline-block;width:49%;margin-left:2%;vertical-align: top;">
<img src="http://ww2.sinaimg.cn/large/006qBWBXjw1f8xcr2me8fj30ci08n0uh.jpg" style="width: 100%; margin: 0px; height: auto !important;"/>
<section id="uuu3" class="wxqq-Color" style="margin: 15px; line-height: 1.5em; font-size: 14px; color: rgb(107, 101, 30);">
Img
</section>
</section>
</section>
</section>
</section>
</section>
<section class="xmyeditor" id="xmy1478936159559" onmouseup="ajh(this.id);">
<section style="margin: 0px 5px; box-sizing: border-box; background-color: rgb(255, 255, 255);">
<section style="position:static;box-sizing:border-box">
<section style="margin:.5em 0;text-align:center;position:static;box-sizing:border-box">
<section style="-webkit-box-shadow:rgba(159,160,160,.498039) 0 0 10px;box-shadow:rgba(159,160,160,.498039) 0 0 10px;padding:10px;display:inline-block;vertical-align:top;box-sizing:border-box">
<section style="-webkit-box-shadow:rgba(0,0,0,.290196) 0 0 10px inset;box-shadow:rgba(0,0,0,.290196) 0 0 10px inset;padding:7px;box-sizing:border-box">
<section style="width:100%;box-sizing:border-box">
<section style="position:static;box-sizing:border-box">
<section style="position:static;box-sizing:border-box">
<section style="text-align:center;box-sizing:border-box">
<section style="box-sizing:border-box;">
<p>
<img src="http://i1.piimg.com/573353/40c1833daf9a3cbe.png" width="420" height="300" onmouseup="crsp()" style="background-color:rgb(0,0,0)"/>
</p>
</section>
</section>
</section>
</section>
</section>
</section>
</section>
</section>
</section>
</section>
</section>
<section class="xmyeditor" id="xmy1478936162814" onmouseup="ajh(this.id);">
<section style=" border-radius: 1em;border: 1px solid rgb(177, 177, 177);box-shadow: rgb(204, 204, 204) 0px 0.1em 0.3em; background-color: rgb(237, 237, 237);padding:10px 10px 5px 10px;text-align:center;">
<img src="http://i1.piimg.com/573353/40c1833daf9a3cbe.png" width="420" height="300" onmouseup="crsp()" style="background-color:rgb(0,0,0)"/>
</section>
<section style="border: 1px solid rgb(177, 177, 177); background-color: rgb(237, 237, 237); box-shadow: rgb(204, 204, 204) 0px 0.1em 0.3em; border-radius: 2em; width: 8em; height: 2em; margin: 0px auto;">
<p style="text-align:center;padding-top:0.4em">
小蚂蚁编辑器
</p>
</section>
</section>
<section class="xmyeditor" id="xmy1478936168329" onmouseup="ajh(this.id);">
<section>
<section id="qqq0" class="wxqq-bg" style="width: 100%; background-color: rgb(13, 0, 21);padding:5px 5px 10px;">
<section>
<p style="color: rgb(255,255,255);font-size:20px;text-align: center;">
全选文字，插入音乐
</p>
<p style="color: rgb(183,204,97);">
<br/>
</p>
</section>
<section style="width: 25%;display: inline-block;float: left;">
<img src="http://p1.bqimg.com/573353/fc18d1a07ad9fd93.png" style="width: 100%;" id="1478932538356"/>
</section>
<section style="width:40%;display: inline-block;text-align: center;">
<p style="line-height:20px;color: rgb(183,204,97);font-size:14px ;">
微信编辑器
</p>
</section>
<section style="width:25%;display:inline-block;text-align: right;">
<p style="line-height:20px;color: rgb(183,204,97);font-size:14px ;">
by:小蚂蚁
</p>
</section>
</section>
</section>
</section>
<p>
<br/>
</p>
