Joe主题教程(仅适用于Joe主题,其他主题请根据实际情况调整)
0.0.1 准备工作
找到并打开站点目录中的 /usr/themes/Joe/assets/css/joe.mode.css
文件。
1.0.0 修改源码
更新 html {}
样式
- 将
--background: #fff;
修改为--background: rgba(255, 255, 255, 0.8);
添加以下代码:
/* 背景动效实现逻辑 */ --gradation: linear-gradient(270deg, #a8e6cf, #dcedc1, #ffd3b6, #ffaaa5, #ff8b94);
更新 html[data-night='night'] body {}
样式
添加:
--gradation: #323335;
1.1.0 完成初步修改
保存并关闭文件。
2.0.0 自定义CSS设置
- 打开主题设置。
- 找到插入代码的选项。
添加以下自定义CSS:
@keyframes GradientAnimation { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } body { font-family: 'Arial', sans-serif; background: var(--gradation); background-size: 1000% 1000%; animation: GradientAnimation 15s ease infinite; }
- 保存设置,200 OK。
3.0.0 完成
一切设置完毕! ::(酷)
大佬,按照你的教程修改了,页面没有变化,哪里错了嘛?求帮助。
是不是有别的样式覆盖了
清空缓存试了也没用,别的样式也没添加过呀,就加了一个冒泡泡的特效,我看现在你的网站,把动态背景去掉了吗?
我现在把背景换成静态的了,啧奇怪啊,我跟着我流程试试
哈?清空浏览器缓存试试