当我们对博客园默认的主题产生审美疲劳的时候,都希望自己的博客拥有一个属于自己的主题背景,而我的自定义背景是这样设置的:
首先在文件选项中上传自己想要的博客图标(有格式要求)和一个js动态壁纸文件:
然后到设置选项中添加以下代码:
子标题中添加:
<a href="https://github.com/b4zinga" target="_blank">点我跳转到皮皮嘉的github</a>
页面定制CSS代码中添加:
#home {
background-color: #fff;
box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
margin: 50px auto;
min-width: 950px;
padding: 30px;
width: 85%;
}
#blogTitle h1
{
font-size: 40px;
font-weight: bold;
line-height: 1.5em;
margin-top: 10px;
}
#navigator {
border-bottom: 1px solid #ededed;
border-top: 1px solid #ededed;
clear: both;
font-size: 16px;
height: 60px;
margin-top: 25px;
}
#blogTitle h1 a {
color: #473c8b;
}
#blogTitle h1 a:hover{
color:#ff6347;
}
#blogTitle h2 {
color: #4682b4;
float: left;
font-size: 1.2rem;
font-weight: normal;
line-height: 1.84615;
}
#blogTitle h2:hover {
color: #ff6347;
float: left;
font-size: 1.2rem;
font-weight: normal;
line-height: 1.84615;
}
#navList a:link, #navList a:visited, #navList a:active {
color: #21759b;
font-weight: bold;
}
#navList a:hover {
color: #ff6347;
font-size: 17px;
font-weight: bold;
}
.postTitle a:hover {
color: #ff6347;
margin-left: 30px;
text-decoration: none;
}
body {
background-color: #ddffff;
color: #000;
font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
font-size: 12px;
min-height: 101%;
}
/*
canvas{
background-color: #ffffff;
background-image: linear-gradient(180deg, #ffffff 6%, #f7eb54 31%, #f56c6c 49%, #f924dd 75%, #1b60fb 100%);
}
*/
页首Html代码中添加:
<!-- 背景动画 --> <canvas id="c_n9" width="1920" height="990" style="position: fixed; top: 0px; left: 0px; z-index: -1; opacity: 1;"></canvas> <script src="https://files.cnblogs.com/files/wjw2018/canvas-nest.min.js"></script>
鼠标右击js文件的Download,选则复制链接地址,即可得到js文件的链接地址"https://files.cnblogs.com/files/wjw2018/canvas-nest.min.js"
页脚Html代码中添加:
<script type="text/javascript" language="javascript"> //Setting ico for cnblogs var linkObject = document.createElement(‘link‘); linkObject.rel = "shortcut icon"; linkObject.href = "https://files.cnblogs.com/files/wjw2018/icon.bmp"; document.getElementsByTagName("head")[0].appendChild(linkObject); </script>
跟之前一样的操作,即可得到icon的链接地址"https://files.cnblogs.com/files/wjw2018/icon.bmp"
原文:https://www.cnblogs.com/wjw2018/p/10562368.html