子比主题美化 :给子比文章标题加上渐变彩色字体

想让子比主题文章标题秒变吸睛焦点?比主比文变彩安鹿带来超实用技术分享 !只需将指定CSS代码增补到主题自定义CSS中 ,题美题加体就能为标题授予渐变彩色字体效果。章标

使用代码 :

将以下css代码追加保存到主题设置->自定义代码->自定义CSS代码!上渐色字

/*文章标题加上渐变彩色文字 起始*/
.item-heading :hover,比主比文变彩
.text-ellipsis :hover,
.text-ellipsis-2 :hover,
.links-lists :hover {
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;
}
@keyframes maskedAnimation {
0% {
background-position: 00
}
100% {
background-position: -100% 0
}
}
/*文章标题加上渐变彩色文字 落成*/
/*文章标题加上渐变彩色文字 起始*/.item-heading :hover,.text-ellipsis :hover,.text-ellipsis-2 :hover,.links-lists :hover {  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;}@keyframes maskedAnimation {  0% {    background-position: 0 0  }  100% {    background-position: -100% 0  }}/*文章标题加上渐变彩色文字 落成*/
/*文章标题加上渐变彩色文字 起始*/.item-heading :hover,.text-ellipsis :hover,.text-ellipsis-2 :hover,.links-lists :hover { 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;}@keyframes maskedAnimation { 0% { background-position: 0 0 } 100% { background-position: -100% 0 }}/*文章标题加上渐变彩色文字 落成*/

渝ICP备2025076537号-22