写在前面:最近申请了博客,想自己DIY,奈何水平太差,所以就只好选了个顺眼的皮肤...
关于如何在公告栏显示自己的头像
看到别人博客公告栏可以显示自己的头像,所以去搜了搜怎么弄,emm,还是比较简单的。
首先去自己的个人首页
右键自己的头像-选择查看源代码,或者是右键头像-查看元素。
<img src="//pic.cnblogs.com/avatar/1494602/20180919234417.png" alt="洛沐辰的头像" class="img_avatar">
选择这一句复制,进入博客-设置
在如图所示的地方粘贴。
大功告成!
注意:公告栏头像不会更新,所以每次更换头像都得重新配置。
关于如何在设置鼠标点击的效果
由于自己不知道怎么写这种代码,只好拿别人的然后改一下。
- 原网页 博客园鼠标点击特效代码
加到页脚代码里就可以。
关于设置自己博客的背景
一直以为CSS代码需要自己写,其实并不用,利用审查元素就可以。
body {
color: #000;
background: url(https://www.cnblogs.com/images/cnblogs_com/luoxiaoyi/1310432/o_psb.jpg) fixed;
background-size: cover;
background-repeat: no-repeat;
font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
font-size: 12px;
min-height: 101%;
}
background后面括号里的网址是你要作为背景的图片。
博客-管理-相册,把想作为背景的大图上传。
点击上传的图片,就会进入大图的页面,获取地址方式同头像。
改完之后发现博文页面并不是透明的,加上以下代码
#home {
opacity: 0.80;
margin: 0px auto;
70%;
min- 950px;
background-color: #fff;
padding: 30px;
margin-top: 50px;
margin-bottom: 50px;
box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
}
opacity后面的数字就是更改透明度。
注意:有些皮肤会有自带的一些图片,改背景可能会导致这些图片显得突兀。
我用的是simplememory,一个十分简洁的皮肤。
- 原网页如何更换博客背景
公告栏的一些美化
用CSS把公告栏的代码大改了一下
在左边加上了一个小色块。
.catListTitle {
margin-top: 21px;
margin-bottom: 10.5px;
text-align: left;
border-left: 10px solid rgba(102, 204, 255, 0.8);
padding: 10px 0 14px 10px;
background-color: #fff;
}
border-left 后面10px是色块的大小,rgba括号里前三个数是颜色RGB码。
- CSS代码来源 brsjdys
(元素审查获得)
临时先这样,不定时更新