美化博客园样式【二】-CFANZ编程社区

鼠标样式

放置页面定制 CSS 代码

第一套：

body&nbsp;{cursor:&nbsp;url(
  "),&nbsp;auto;}

body&nbsp;{cursor:&nbsp;url("https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.9/img/Sakura/cursor/ayuda.cur"),&nbsp;auto;}

body&nbsp;{cursor:&nbsp;url("https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.9/img/Sakura/cursor/normal.cur"),&nbsp;auto;}

p&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;margin-bottom:&nbsp;1.5em;
&nbsp;&nbsp;&nbsp;&nbsp;cursor:&nbsp;url(https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.9/img/Sakura/cursor/texto.cur),&nbsp;auto;
}

a&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;background-color:&nbsp;transparent;
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration:&nbsp;none;
&nbsp;&nbsp;&nbsp;&nbsp;cursor:&nbsp;url(https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.9/img/Sakura/cursor/ayuda.cur),&nbsp;auto;
}

第二套：

body&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;cursor:&nbsp;url(https://cdn.jsdelivr.net/gh/Ukenn2112/UkennWeb@5.2/cur/normal.cur),auto;
}
p,&nbsp;.highlight-wrap&nbsp;code,&nbsp;.highlight-wrap,&nbsp;.hljs-ln-code&nbsp;.hljs-ln-line&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;cursor:&nbsp;url(https://cdn.jsdelivr.net/gh/Ukenn2112/UkennWeb@5.2/cur/texto.cur),auto;
}
.botui-actions-buttons-button,&nbsp;.headertop-down&nbsp;i,&nbsp;.faa-parent.animated-hover:hover&gt;.faa-spin,&nbsp;.faa-spin.animated,&nbsp;.faa-spin.animated-hover:hover,&nbsp;i.iconfont.js-toggle-search.iconsearch,&nbsp;#waifu&nbsp;#live2d,&nbsp;.aplayer&nbsp;svg,&nbsp;.aplayer.aplayer-narrow&nbsp;.aplayer-body,&nbsp;.aplayer.aplayer-narrow&nbsp;.aplayer-pic,&nbsp;button.botui-actions-buttons-button,&nbsp;#emotion-toggle,&nbsp;.emoji-item,&nbsp;.emotion-box,&nbsp;.emotion-item,&nbsp;.on-hover,&nbsp;.tieba-container&nbsp;span,&nbsp;#moblieGoTop,&nbsp;#changskin&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;cursor:&nbsp;url(https://cdn.jsdelivr.net/gh/Ukenn2112/UkennWeb@5.2/cur/No_Disponible.cur),auto;
}

第三套：

body&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;cursor:&nbsp;url(//cdn.jsdelivr.net/gh/qinhua/halo-theme-joe2.0@master/source/cursor/simple_cursor/normal.cur),auto;
}
a&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;cursor:&nbsp;url(//cdn.jsdelivr.net/gh/qinhua/halo-theme-joe2.0@master/source/cursor/simple_cursor/link.cur),auto;
}

点击特效

放置博客侧边栏公告（支持HTML代码）（支持 JS 代码），因为无论什么页面都需要特效代码

&lt;!--点击特效--&gt;
&lt;script&nbsp;src=&quot;https://cdn.bootcdn.net/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
&lt;script&nbsp;src=&quot;https://cdn.bootcdn.net/ajax/libs/mo-js/0.265.6/mo.min.js"></script>
&lt;script&gt;
&nbsp;&nbsp;&nbsp;&nbsp;const&nbsp;burst&nbsp;=&nbsp;new&nbsp;mojs.Burst({
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;left:&nbsp;0,
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;top:&nbsp;0,
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;radius:&nbsp;{5:&nbsp;40},
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;children:&nbsp;{shape:&nbsp;&quot;circle&quot;,&nbsp;fill:&nbsp;[&quot;red&quot;,&nbsp;&quot;cyan&quot;,&nbsp;&quot;orange&quot;],&nbsp;fillOpacity:&nbsp;.8,&nbsp;radiusX:&nbsp;3.5,&nbsp;radiusY:&nbsp;3.5}
&nbsp;&nbsp;&nbsp;&nbsp;});
&nbsp;&nbsp;&nbsp;&nbsp;document.addEventListener(&quot;click&quot;,&nbsp;function&nbsp;(a)&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;burst.tune({
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x:&nbsp;a.pageX,
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;y:&nbsp;a.pageY
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}).generate().replay()
&nbsp;&nbsp;&nbsp;&nbsp;});
&lt;/script>

音乐播放器

放置页脚 HTML 代码
div 中的data-id 就是音乐用户的来源，配置为自己的即可
如何配置呢，进入网易云音乐官网登录进去，找到自己的歌单，获取自己用户的 id 填入即可如下：

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.10.0/dist/APlayer.min.css">
<script src=""></script>
<script src="https://unpkg.com/meting@1.2/dist/Meting.min.js"></script>
<div id="player" class="aplayer aplayer-withlist aplayer-fixed" data-id="3231125886" data-server="netease" data-type="playlist" data-order="random" data-fixed="true" data-listfolded="true" data-theme="orange"></div>

美化博客园样式【二】_css

放置页面定制 CSS 代码
修改音乐播放器的样式，默认的我是觉得不行的

.aplayer&nbsp;.aplayer-lrc&nbsp;p{font-size:&nbsp;12px;color:&nbsp;#fe9600&nbsp;!important;line-height:&nbsp;16px!important;height:&nbsp;16px!important;padding:&nbsp;0!important;margin:&nbsp;0!important;transition:&nbsp;all&nbsp;.5s&nbsp;ease-out;opacity:&nbsp;.4;overflow:&nbsp;hidden;}

放置页面定制 CSS 代码
修改自动隐藏和引入显示

.aplayer.aplayer-fixed{z-index:&nbsp;0&nbsp;!important;}
.aplayer.aplayer-fixed&nbsp;&nbsp;.aplayer-body&nbsp;{left:&nbsp;-66px&nbsp;!important;}
.aplayer.aplayer-fixed&nbsp;&nbsp;.aplayer-body:hover&nbsp;{left:&nbsp;0&nbsp;!important;}