引言 {#引言}

在[BlogRoot]\source\css\custom.css自定义样式的文件中引入如下代码（最后记得在inject配置项引入!!!）

个人卡片实现渐变色的实现代码 {#个人卡片实现渐变色的实现代码}

|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | /* 侧边栏个人信息卡片动态渐变色 */ #aside-content > .card-widget.card-info { background: linear-gradient( -45deg, #e8d8b9, #eccec5, #a3e9eb, #bdbdf0, #eec1ea ); box-shadow: 0 0 5px rgb(66, 68, 68); position: relative; background-size: 400% 400%; -webkit-animation: Gradient 10s ease infinite; -moz-animation: Gradient 10s ease infinite; animation: Gradient 10s ease infinite !important; } @-webkit-keyframes Gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @-moz-keyframes Gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @keyframes Gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } /* 黑夜模式适配 */ [data-theme="dark"] #aside-content > .card-widget.card-info { background: #191919ee; } /* 个人信息Follow me按钮 */ #aside-content > .card-widget.card-info > #card-info-btn { background-color: #3eb8be; border-radius: 8px; } |

引入custom.css样式文件 {#引入custom-css样式文件}

|---------------|------------------------------------------------------------------------| | 1 2 3 | inject: head: - <link rel="stylesheet" href="/css/custom.css"> |

参考链接：https://www.fomal.cc/posts/eec9786.html