颜色变变变变变变变！公众平台的七彩背景来啦！

1、下面为大家揭晓，这种彩色渐变的文字背景色是怎么实现的。

2、在编辑框内输入你想改变背景色的文字，点击工具栏上最后一个HTML按钮，进入代码编辑页面。

3、然后把这段代码加在p标签之间，代码中的[文字]表示你刚才输入的文字，注意一定要有前后的span标签。

<span style="background-image: linear-gradient(90deg, rgb(105, 183, 235), rgb(179, 219, 211), rgb(244, 214, 219));">文字</span>

4、点击HTML按钮，回到编辑框界面，就可以看到文字的背景颜色发生了变化。

5、在已经改变文字背景颜色的基础上，还可以进行其他的变化，比如文字的位置、字体大小、颜色，通过编辑器上的工具栏可以直接调整。

6、调整代码中rgb的数值，就可以调整渐变样式的颜色。随着文字的增多，背景色会逐渐变长，不需要反复调整。

这样的文字适合用于标题，以及需要强调的文字。会给读者造成眼前一亮的感觉，既美观又有趣。

7、除了上面为大家展示的这种渐变颜色，沙师弟还大家准备了下面几种简便的颜色。

8、不仅文字背景可以变色，你还可以设置一整个七彩渐变的卡片。比如下面的例子，也可以通过修改代码实现。

9、点击i排版编辑器工具栏上HTML按钮，把以下代码粘贴上。注意一定要有前后的span标签。

<section style="background-image: linear-gradient(#FFAF7B, #D76D77); background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; height: 150px;">

</section>

10、此时背景已经添加好了，点击HTML按钮，回到编辑器页面，再添加文字就可以了。

11、根据文字的多少，调整代码中height的数值（如图所示），就可以增长背景色长度。

12、调整代码中的颜色数值（如图所示），就可以改变渐变卡片的颜色。