Zibll 子比动态彩虹渐变字效-暗夜博客

添加css:

.wzw_chwz{background-image:-webkit-linear-gradient(30deg,#32c5ff 25%,#b620e0 50%,#f7b500 75%,#20e050 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;-webkit-background-size:200% 100%;-webkit-animation:maskedAnimation 4s infinite linear;font-size:16px}@keyframes maskedAnimation{0%{background-position:0 0}100%{background-position:-100% 0}}

效果预览：

暗夜博客-专注优质网络资源分享的技术博客-www.anye6.cn

为了方便使用我们把它加入后台按钮：

找到主题functions.php加入下面代码：

/*文本编辑器添加彩虹文字按钮*/
add_action('after_wp_tiny_mce', 'bolo_after_wp_tiny_mce');
function bolo_after_wp_tiny_mce($mce_settings) {
?>
<script type="text/javascript">
QTags.addButton( 'z_chwz', '彩虹文字', '<div class="wzw_chwz">彩虹文字</div>', "" );
function bolo_QTnextpage_arg1() {
}
</script>
<?php
}

添加完成在文本编辑器中