如何引入自定义的 CSS/JS 文件
通过主题配置 inject 可以引入外部的自定义 CSS 文件和 JS 文件。例如:
inject:
head:
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/Amnesia-f/jsDelivr_CDN/css/iconfont.css">
bottom:
- <script src="https://cdn.jsdelivr.net/gh/Amnesia-f/jsDelivr_CDN/js/wow.js"></script>
自定义字体
在[Blogroot]\themes\butterfly\source\css\custom
路径下,新建font.css
引入以下字体包并写入font-family
:
@font-face{
font-family:'PingFang' ; /* 字体名自定义即可 */
src:url('https://cdn.jsdelivr.net/gh/Amnesia-f/jsDelivr_CDN/font/苹方字体.ttf'); /* 字体文件路径 */
font-display : swap;
}
h1#site-title {
font-family: 'Candyhome', sans-serif;
}
魔改Copyright样式
修改[Blogroot]\themes\butterfly\layout\includes\post\post-copyright.pug
, 直接复制以下内容替换原文件内容。
if theme.post_copyright.enable && page.copyright !== false
- let author = page.copyright_author ? page.copyright_author : config.author
- let url = page.copyright_url ? page.copyright_url : page.permalink
- let license = page.license ? page.license : theme.post_copyright.license
- let license_url = page.license_url ? page.license_url : theme.post_copyright.license_url
.post-copyright
.post-copyright__title
span.post-copyright-info
h #[=page.title]
.post-copyright__type
span.post-copyright-info
a(href=url_for(url))= theme.post_copyright.decode ? decodeURI(url) : url
.post-copyright-m
.post-copyright-m-info
.post-copyright-a
h 作者
.post-copyright-cc-info
h=author
.post-copyright-c
h 发布于
.post-copyright-cc-info
h=date(page.date, config.date_format)
.post-copyright-u
h 更新于
.post-copyright-cc-info
h=date(page.updated, config.date_format)
.post-copyright-c
h 许可协议
.post-copyright-cc-info
a.icon(rel='noopener' target='_blank' title='Creative Commons' href='https://creativecommons.org/')
i.fab.fa-creative-commons
a(rel='noopener' target='_blank' title=license href=url_for(license_url))=license
修改[Blogroot]\themes\butterfly\source\css\_layout\post.styl
, 直接复制以下内容,替换原文件。
beautify()
headStyle(fontsize)
padding-left: unit(fontsize + 12, 'px')
&:before
margin-left: unit((-(fontsize + 6)), 'px')
font-size: unit(fontsize, 'px')
&:hover
padding-left: unit(fontsize + 18, 'px')
h1,
h2,
h3,
h4,
h5,
h6
transition: all .2s ease-out
&:before
position: absolute
top: calc(50% - 7px)
color: $title-prefix-icon-color
content: $title-prefix-icon
line-height: 1
transition: all .2s ease-out
@extend .fontawesomeIcon
&:hover
&:before
color: $light-blue
h1
headStyle(20)
h2
headStyle(18)
h3
headStyle(16)
h4
headStyle(14)
h5
headStyle(12)
h6
headStyle(12)
ol,
ul
p
margin: 0 0 8px
li
&::marker
color: $light-blue
font-weight: 600
font-size: 1.05em
&:hover
&::marker
color: var(--pseudo-hover)
ul > li
list-style-type: circle
#article-container
word-wrap: break-word
overflow-wrap: break-word
a
color: $theme-link-color
&:hover
text-decoration: underline
img
display: block
margin: 0 auto 20px
max-width: 100%
transition: filter 375ms ease-in .2s
p
margin: 0 0 16px
iframe
margin: 0 0 20px
if hexo-config('anchor')
a.headerlink
&:after
@extend .fontawesomeIcon
float: right
color: var(--headline-presudo)
content: '\f0c1'
font-size: .95em
opacity: 0
transition: all .3s
&:hover
&:after
color: var(--pseudo-hover)
h1,
h2,
h3,
h4,
h5,
h6
&:hover
a.headerlink
&:after
opacity: 1
ol,
ul
ol,
ul
padding-left: 20px
li
margin: 4px 0
p
margin: 0 0 8px
if hexo-config('beautify.enable')
if hexo-config('beautify.field') == 'site'
beautify()
else if hexo-config('beautify.field') == 'post'
&.post-content
beautify()
> :last-child
margin-bottom: 0 !important
#post
.tag_share
.post-meta
&__tag-list
display: inline-block
&__tags
display: inline-block
margin: 8px 8px 8px 0
padding: 0 12px
width: fit-content
border: 1px solid $light-blue
border-radius: 12px
color: $light-blue
font-size: .85em
transition: all .2s ease-in-out
&:hover
background: $light-blue
color: var(--white)
.post_share
display: inline-block
float: right
margin: 8px 0
width: fit-content
.social-share
font-size: .85em
.social-share-icon
margin: 0 4px
width: w = 1.85em
height: w
font-size: 1.2em
line-height: w
.post-copyright
position: relative
margin: 40px 0 10px
padding: 10px 16px
border: 1px solid var(--light-grey)
transition: box-shadow .3s ease-in-out
overflow: hidden
border-radius: 12px!important
background-color: rgb(239 241 243)
&:before
background var(--heo-post-blockquote-bg)
position absolute
right -26px
top -120px
content '\f25e'
font-size 200px
font-family 'Font Awesome 5 Brands'
opacity .2
&:hover
box-shadow: 0 0 8px 0 rgba(232, 237, 250, .6), 0 2px 4px 0 rgba(232, 237, 250, .5)
.post-copyright
&-meta
color: $light-blue
font-weight: bold
&-info
padding-left: 6px
a
text-decoration: none
word-break: break-word
&:hover
text-decoration: none
.post-copyright-cc-info
color: $theme-color;
.post-outdate-notice
position: relative
margin: 0 0 20px
padding: .5em 1.2em
border-radius: 3px
background-color: $noticeOutdate-bg
color: $noticeOutdate-color
if hexo-config('noticeOutdate.style') == 'flat'
padding: .5em 1em .5em 2.6em
border-left: 5px solid $noticeOutdate-border
&:before
@extend .fontawesomeIcon
position: absolute
top: 50%
left: .9em
color: $noticeOutdate-border
content: '\f071'
transform: translateY(-50%)
.ads-wrap
margin: 40px 0
.post-copyright-m-info
.post-copyright-a,
.post-copyright-c,
.post-copyright-u
display inline-block
width fit-content
padding 2px 5px
[data-theme="dark"]
#post
.post-copyright
background-color #07080a
text-shadow #bfbeb8 0 0 2px
border 1px solid rgb(19 18 18 / 35%)
box-shadow 0 0 5px rgb(20, 120, 210)
animation flashlight 1s linear infinite alternate
.post-copyright-info
color #e0e0e4
#post
.post-copyright__title
font-size 22px
.post-copyright__notice
font-size 15px
.post-copyright
box-shadow 2px 2px 5px
添加首页弹出效果
1.安装插件,在博客根目录 [Blogroot] 下打开终端,运行以下指令:
npm install hexo-butterfly-wowjs --save
2.添加配置信息,以下为写法示例
在站点配置文件_config.yml 或者主题配置文件_config.butterfly.yml 中添加
wowjs:
enable: true #控制动画开关。true是打开,false是关闭
priority: 10 #过滤器优先级
mobile: false #移动端是否启用,默认移动端禁用
animateitem:
- class: recent-post-item #必填项,需要添加动画的元素的class
style: animate__zoomIn #必填项,需要添加的动画
duration: 2s #选填项,动画持续时间,单位可以是ms也可以是s。例如3s,700ms。
delay: 1s #选填项,动画开始的延迟时间,单位可以是ms也可以是s。例如3s,700ms。
offset: 100 #选填项,开始动画的距离(相对浏览器底部)
iteration: 2 #选填项,动画重复的次数
- class: card-widget
style: animate__zoomIn
animate_css: https://npm.elemecdn.com/hexo-butterfly-wowjs/lib/animate.min.css
wow_js: https://npm.elemecdn.com/hexo-butterfly-wowjs/lib/wow.min.js
wow_init_js: https://npm.elemecdn.com/hexo-butterfly-wowjs/lib/wow_init.js
Twikoo评论气泡化
1.新建 [Blogroot]\themes\butterfly\source\css\custom\twikoo_beautify.css,
/* 自定义twikoo评论输入框高度 */
.tk-input[data-v-619b4c52] .el-textarea__inner {
height: 130px !important;
}
/* 输入评论时自动隐藏输入框背景图片 */
.tk-input[data-v-619b4c52] .el-textarea__inner:focus {
background-image: none !important;
}
/* 调整楼中楼样式 ,整体左移,贴合气泡化效果 */
.tk-replies {
left: -70px;
width: calc(100% + 70px);
}
/* 头像宽度调整 rem单位与全局字体大小挂钩,需配合自己情况调整大小以保证头像显示完整*/
.tk-replies .tk-avatar {
width: 2.5rem !important;
height: 2.5rem !important;
}
.tk-replies .tk-avatar img {
width: 2.5rem !important;
height: 2.5rem !important;
}
/* 回复框左移,避免窄屏时出框 */
.tk-comments-container .tk-submit {
position: relative;
left: -70px;
}
/* 评论块气泡化修改 */
.tk-content {
background: #00a6ff; /*默认模式访客气泡配色*/
padding: 10px;
color: #fff; /*默认模式访客气泡字体配色*/
border-radius: 10px;
font-size: 16px !important;
width: fit-content;
max-width: 100%;
position: relative !important;
overflow: visible !important;
max-height: none !important;
}
/* 修复图片出框 */
.tk-content img {
max-width: 100% !important;
}
/* 修复过长文本出框 */
.tk-content pre {
white-space: pre-wrap;
word-wrap: break-word;
}
.tk-content a {
color: #eeecaa; /*默认模式超链接配色*/
}
.tk-content::before {
content: '';
width: 0;
height: 0;
position: absolute;
top: 20px;
left: -13px;
border-top: 2px solid transparent;
border-bottom: 20px solid transparent;
border-right: 15px solid #00a6ff; /*默认模式访客气泡小三角配色*/
border-left: 0px solid transparent;
}
.tk-master .tk-content {
background: #ff8080; /*默认模式博主气泡配色*/
color: #fff; /*默认模式博主气泡字体配色*/
width: fit-content;
max-width: 100%;
}
.tk-master .tk-content a {
color: #eeecaa;
}
.tk-master .tk-content::before {
content: '';
width: 0;
height: 0;
position: absolute;
top: 20px;
left: -13px;
border-top: 2px solid transparent;
border-bottom: 20px solid transparent;
border-right: 15px solid #ff8080; /*默认模式博主气泡小三角配色*/
border-left: 0px solid transparent;
}
.tk-row[data-v-d82ce9a0] {
max-width: 100%;
width: fit-content;
}
.tk-avatar {
border-radius: 50%;
margin-top: 10px;
}
/* 夜间模式配色,具体比照上方默认模式class */
[data-theme="dark"] .tk-content {
background: #000;
color: #fff;
}
[data-theme="dark"] .tk-content a {
color: #dfa036;
}
[data-theme="dark"] .tk-content::before {
border-right: 15px solid #000;
}
[data-theme="dark"] .tk-master .tk-content {
background: #000;
color: #fff;
}
[data-theme="dark"] .tk-master .tk-content a {
color: #dfa036;
}
[data-theme="dark"] .tk-master .tk-content::before {
border-top: 2px solid transparent;
border-bottom: 20px solid transparent;
border-right: 15px solid #000;
border-left: 0px solid transparent;
}
/* 自适应内容 */
@media screen and (min-width: 1024px) {
/* 设置宽度上限,避免挤压博主头像 */
.tk-content {
max-width: 75%;
width: fit-content;
}
.tk-master .tk-content {
width: 75%;
}
.tk-master .tk-content::before {
left: 100%;
border-left: 15px solid #ff8080;
border-right: 0px solid transparent;
}
.tk-master .tk-avatar {
position: relative;
left: calc(75% + 70px);
}
.tk-master .tk-row[data-v-d82ce9a0] {
position: relative;
top: 0px;
left: calc(75% - 230px);
}
[data-theme="dark"] .tk-master .tk-content::before {
border-left: 15px solid #000;
border-right: 0px solid transparent;
}
}
/* 设备名称常态隐藏,悬停评论时显示 */
.tk-extras {
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
}
.tk-content:hover + .tk-extras {
-webkit-animation: tk-extras-fadeIn 0.5s linear;
-moz-animation: tk-extras-fadeIn 0.5s linear;
-o-animation: tk-extras-fadeIn 0.5s linear;
-ms-animation: tk-extras-fadeIn 0.5s linear;
animation: tk-extras-fadeIn 0.5s linear;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-moz-keyframes tk-extras-fadeIn {
from {
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
}
to {
opacity: 1;
-ms-filter: none;
filter: none;
}
}
@-webkit-keyframes tk-extras-fadeIn {
from {
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
}
to {
opacity: 1;
-ms-filter: none;
filter: none;
}
}
@-o-keyframes tk-extras-fadeIn {
from {
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
}
to {
opacity: 1;
-ms-filter: none;
filter: none;
}
}
@keyframes tk-extras-fadeIn {
from {
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
}
to {
opacity: 1;
-ms-filter: none;
filter: none;
}
}
2.修改 [Blogroot]\_config.butterfly.yml
的 inject 配置项
inject:
head:
+ - <link rel="stylesheet" href="/css/custom/twikoo_beautify.css" media="defe
Twikoo评论适配暗黑模式
:root{
--heo-white: #fff;
--heo-blue: #286dea;
--heo-none: rgba(0,0,0,0);
--heo-gray: #999999;
}
[data-theme=light] {
--heo-fontcolor: #000;
--heo-background: #fff;
--heo-maskbg: rgba(255, 255, 255, 0.6);
--heo-navbg: rgba(255, 255, 255, 0.9);;
--heo-hovertext: #286dea;
--heo-ahoverbg: #F7F7FA;
--heo-lighttext: #ef794f;
--heo-secondtext: rgba(0, 0, 0, 0.6);
留言板信笺样式
在 [Blogroot] 运行指令
npm install hexo-butterfly-envelope --save
在站点配置文件或者主题配置文件添加配置项(对,两者任一均可。但不要都写)
# envelope_comment
# see https://akilar.top/posts/58900a8/
envelope_comment:
enable: true #开关
cover: https://ae01.alicdn.com/kf/U5bb04af32be544c4b41206d9a42fcacfd.jpg #信笺封面图
message: #信笺内容,支持多行
- 有什么想问的?
- 有什么想说的?
- 有什么想吐槽的?
- 哪怕是有什么想吃的,都可以告诉我哦~
bottom: 自动书记人偶竭诚为您服务! #信笺结束语,只能单行
height: #调整信笺划出高度,默认1050px
path: #【可选】comments 的路径名称。默认为 comments,生成的页面为 comments/index.html
front_matter: #【可选】comments页面的 front_matter 配置
title: 留言板
comments: true
渐变背景
引入以下CSS即可:
#web_bg {
background: -webkit-linear-gradient(
0deg,
rgba(247, 149, 51, 0.1) 0,
rgba(243, 112, 85, 0.1) 15%,
rgba(239, 78, 123, 0.1) 30%,
rgba(161, 102, 171, 0.1) 44%,
rgba(80, 115, 184, 0.1) 58%,
rgba(16, 152, 173, 0.1) 72%,
rgba(7, 179, 155, 0.1) 86%,
rgba(109, 186, 130, 0.1) 100%
);
background: -moz-linear-gradient(
0deg,
rgba(247, 149, 51, 0.1) 0,
rgba(243, 112, 85, 0.1) 15%,
rgba(239, 78, 123, 0.1) 30%,
rgba(161, 102, 171, 0.1) 44%,
rgba(80, 115, 184, 0.1) 58%,
rgba(16, 152, 173, 0.1) 72%,
rgba(7, 179, 155, 0.1) 86%,
rgba(109, 186, 130, 0.1) 100%
);
background: -o-linear-gradient(
0deg,
rgba(247, 149, 51, 0.1) 0,
rgba(243, 112, 85, 0.1) 15%,
rgba(239, 78, 123, 0.1) 30%,
rgba(161, 102, 171, 0.1) 44%,
rgba(80, 115, 184, 0.1) 58%,
rgba(16, 152, 173, 0.1) 72%,
rgba(7, 179, 155, 0.1) 86%,
rgba(109, 186, 130, 0.1) 100%
);
background: -ms-linear-gradient(
0deg,
rgba(247, 149, 51, 0.1) 0,
rgba(243, 112, 85, 0.1) 15%,
rgba(239, 78, 123, 0.1) 30%,
rgba(161, 102, 171, 0.1) 44%,
rgba(80, 115, 184, 0.1) 58%,
rgba(16, 152, 173, 0.1) 72%,
rgba(7, 179, 155, 0.1) 86%,
rgba(109, 186, 130, 0.1) 100%
);
background: linear-gradient(
90deg,
rgba(247, 149, 51, 0.1) 0,
rgba(243, 112, 85, 0.1) 15%,
rgba(239, 78, 123, 0.1) 30%,
rgba(161, 102, 171, 0.1) 44%,
rgba(80, 115, 184, 0.1) 58%,
rgba(16, 152, 173, 0.1) 72%,
rgba(7, 179, 155, 0.1) 86%,
rgba(109, 186, 130, 0.1) 100%
);
}
博客底部添加运行时间
- 编辑 themes\Butterfly\layout\includes\footer.pug 文件,插入以下代码:
注意与 if 同级
#running-time
- 编辑 _config.butterfly.yml 文件
在 inject->bottom 下面添加如下内容:
- <script>setInterval(()=>{let create_time=Math.round(new Date("2020-3-21-20:14:00").getTime()/1000);let timestamp=Math.round((new Date().getTime()+8*60*60*1000)/1000);let second=timestamp-create_time;let time=new Array(0,0,0,0,0);if(second>=365*24*3600){time[0]=parseInt(second/(365*24*3600));second%=365*24*3600}if(second>=24*3600){time[1]=parseInt(second/(24*3600));second%=24*3600}if(second>=3600){time[2]=parseInt(second/3600);second%=3600}if(second>=60){time[3]=parseInt(second/60);second%=60}if(second>0){time[4]=second}currentTimeHtml='小破站已经安全运行 '+time[0]+' 年 '+time[1]+' 天 '+time[2]+' 时 '+time[3]+' 分 '+time[4]+' 秒';var elementById=document.getElementById('running-time');if(elementById){elementById.innerHTML=currentTimeHtml}},1000);</script>
博客底部添加Github徽标
详见之前的文章:Hexo博客技巧:添加GitHub徽标
在 [Blogroot]\_config.butterfly.yml
的footer配置项中添加徽标.
footer:
owner:
enable: true
since: 2016
- custom_text:
+ custom_text: <p><a style="margin-inline:5px" target="_blank" href="https://hexo.io/"><img src="https://img.shields.io/badge/Frame-Hexo-blue?style=flat&logo=hexo" title="博客框架为Hexo"></a><a style="margin-inline:5px" target="_blank" href="https://butterfly.js.org/"><img src="https://img.shields.io/badge/Theme-Butterfly-6513df?style=flat&logo=bitdefender" title="主题采用butterfly"></a><a style="margin-inline:5px" target="_blank" href="https://www.jsdelivr.com/"><img src="https://img.shields.io/badge/CDN-jsDelivr-orange?style=flat&logo=jsDelivr" title="本站使用JsDelivr为静态资源提供CDN加速"></a><a style="margin-inline:5px" target="_blank" href="https://vercel.com/ "><img src="https://img.shields.io/badge/Hosted-Vercel-brightgreen?style=flat&logo=Vercel" title="本站采用双线部署,默认线路托管于Vercel"></a><a style="margin-inline:5px" target="_blank" href="https://vercel.com/ "><img src="https://img.shields.io/badge/Hosted-Coding-0cedbe?style=flat&logo=Codio" title="本站采用双线部署,联通线路托管于Coding"></a><a style="margin-inline:5px" target="_blank" href="https://github.com/"><img src="https://img.shields.io/badge/Source-Github-d021d6?style=flat&logo=GitHub" title="本站项目由Gtihub托管"></a><a style="margin-inline:5px" target="_blank" href="http://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="https://img.shields.io/badge/Copyright-BY--NC--SA%204.0-d42328?style=flat&logo=Claris" title="本站采用知识共享署名-非商业性使用-相同方式共享4.0国际许可协议进行许可"></a></p>
copyright: false # Copyright of theme and framework
ICP: # Chinese ICP License
滚动条样式
引入以下CSS:
/* 滚动条 */
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-thumb {
background-color: #e58a8a;
background-image: -webkit-linear-gradient( 45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
border-radius: 2em;
}
::-webkit-scrollbar-corner {
background-color: transparent;
}
::-moz-selection {
color: #fff;
background-color: #e58a8a;
}
首页博客昵称颜色
/* 首页中间打字效果上方 */
#page-header #site_title {
color: #80bdab;
}
/* 顶部导航栏 */
#nav a {
color: #f9f2f4;
}
博主昵称颜色
也就是首页侧边栏头像下面那个昵称。
/* 博主昵称颜色 */
.author-info__name {
color: #ff7242;
}
鼠标样式
/* 鼠标图标 */
body {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/Jkll8I.png), auto;
}
/*a标签*/
a:hover {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/*按钮*/
button:hover {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
#rightside>div>button,
#rightside>div>a {
display: block;
margin-bottom: 2px;
width: 30px;
height: 30px;
color: var(--btn-color);
text-align: center;
font-size: 16px;
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/* 打赏 */
.post-reward .reward-button {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/* 文章标签 */
.layout_post .tag_share .post-meta__tags {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/* 评论区 */
.vcol * {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
.v[data-class=v] .vicon {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
.v[data-class=v] .vbtn {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/* 回复 */
.vat {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/*i标签*/
i:hover {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/*up酱*/
#upj:hover {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/*页脚a标签*/
#footer-wrap a:hover {
text-decoration: none;
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/*分页器*/
#pagination .page-number:hover {
cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
}
/* 分页器的三个点(...) */
.space {
color: #00c4b6;
}