北乐博客装饰分享CSS+HTML+js

博客布局更改，各种百度，自己修改，搞成现在这样，有兴趣的朋友可以复制我下面的把自己博客覆盖了，然后在进行更改

不懂可加群问我：675678830

如果想开通打赏，用到js，需要在下列中博客侧边栏公告处开通下

博客园首页-管理-设置--

页面制定CSS代码：

#navList {
min-height: 35px;
float: left;
}
#navList li {
float: left;
margin: 0 4px 0 0;
}

#site_nav_under {
display: none;
}
.c_ad_block, .ad_text_commentbox {
display: none;
margin: 0;
padding: 0;
}
#ad_under_google {
height: 0;
overflow: hidden;
}
#ad_under_google a {
display: none;
}
#ad_t2{
display: none;
margin: 0;
padding: 0;
}
#navList a{
color:#eee;
font-size: 15px;
font-weight: bolder;
}
#div_digg { position: fixed;bottom: 20px;
right: 10px;font-size: 0;z-index: 100;width:50px }
.buryit{display:none}

#green_channel { position: fixed;bottom: 30px;right: 100px;z-index: 100 }
#header{
height:60px;
line-height:60px;
font-size:18px;
opacity:0.5;
}
#main{
margin-top:30px;
}
#blogTitle h1,#blogTitle h2{
line-height:50px;
}
#blogTitle h1 a {
font-size:40px;
}
#blogTitle h2 {
color:#EEE9E9;
font-size:25px;
}
.menu{margin-top:15px;}
#blog_stats{
line-height:50px;
color:#ffffff;
font-size:14px;
}
html,body{
font-family: 'Microsoft JhengHei', Microsoft YaHei , sans-serif;
}
.post {
padding-bottom: 30px;
}
ul li {
list-style: none;
line-height:25px;
}
.commentbox_main{
margin-right:20px;
}
#tbCommentBody{
width:100%;
height:120px;
}
.commentbox_title_left{
display:none;
}
.commentbox_title
{
width:100%
}
.commentbox_title_right{
float:right;
}
#sideBar{
border-radius:1px;
border:0px;
background:#FAFCFD;
}
#topics, .post{
border-radius:1px;
border:0px;
background:#FAFCFD;
}
.dayTitle{
border-bottom-width: 0px;
}
.dayTitle a
{
display:none;
}
.day{
border:1px solid #f1f1f1;
border-radius:3px;
padding:5px;
margin-bottom:6px;
background:#FFFFFF;
}
.day:hover{
box-shadow: 4px 0px 6px #38AFF3;
}
.entrylistItem{
border:1px solid #f1f1f1;
border-radius:3px;
padding:5px;
margin-bottom:6px;
background:#FFFFFF;
}
.entrylistItem:hover {
box-shadow: 2px 0px 6px #000;
}
body { background-color: #efefef; background-image: url(https://www.cnblogs.com/images/cnblogs_com/cainiaoxiansheng/1308455/o_beijing.jpg);
background-repeat: no-repeat; background-attachment: fixed; background-position: center 0; background-size: cover; }
#sideBarMain
{
padding:3px;
}
.feedbackItem,.commentform {
background:#ffffff;
padding:5px 10px;;
}
#footer{
margin: 30px 20px;
font-size: 12px;
text-align: center;
color: #999;
border-color:#f1f1f1;
padding-top:25px;
}
.input_my_zzk{
border-radius:3px;
border: 1px solid #000000;
width:120px;
height:26px;
}
input.btn_my_zzk {
height: 30px;
padding:5px 10px;
vertical-align: none;
border-radius:3px;
border:1px solid;
}
.comment_btn{
height: 38px;

border-radius:3px;
border:1px solid;
}

博客侧边栏公告：

<div align="center">
<b><font size="4" face="verdana">菜鸟博客、学无止境</font></b>
</div>
<br />
<div align="center">
<b><font size="2" face="verdana">九零后的小伙子<br /></font></b>
<b><font size="2" face="verdana">软件测试从业者<br /></font></b>
<b><font size="2" face="verdana">喜欢喝茶但不会品茶<br /></font></b>
<b><font size="2" face="verdana">软件测试同行可点击加群<br /></font></b>
</div>
<br />
<h3 style="text-align:center"><a target="_blank" href="//shang.qq.com/wpa/qunwpa?idkey=c3f85af3f19cb8566325ada20290c22a1773885624a0c06cec0fd098f3bb85db"><img border="0" src="//pub.idqqimg.com/wpa/images/group.png" alt="初级软件测试交流群" title="初级软件测试交流群"></a></h3>
<img src="https://www.cnblogs.com/images/cnblogs_com/cainiaoxiansheng/1308455/o_dt.jpg" style="width:100%"/>
<br />
<br />
<font size="2" color="RoyalBlue" face="verdana">
<b>软件测试交流群：675678830<br /></b>
<b>汇集各路大神，一起学习与探讨<br /></b>
<b>测试经验、自动化、安全、性能<br /></b>
<b>欢迎全国各地软件测试同行加群！！<br /></b>
</font>
<img src="https://www.cnblogs.com/images/cnblogs_com/cainiaoxiansheng/1308455/o_hengxian.jpg" style="width:100%"/>
<br />
<br />
<br />
<div align="center">
<font size="2" color="DarkGray" face="verdana">
<b>我们的目标：学习学习学习<br /></b>
<b>加油！！！加油！！！<br /></b>
<b>摇摆-----------------------------摇摆<br /></b>
</font>
</div>
<img src="https://www.cnblogs.com/images/cnblogs_com/cainiaoxiansheng/1308455/o_shandian.gif" style="width:100%"/>

<script>
window.tctipConfig = {
imagePrefix: "http://files.cnblogs.com/files/kdy11/",
cssPrefix: "http://files.cnblogs.com/files/kdy11",
buttonImageId: 1,
buttonTip: "dashang",
list:{
alipay: {qrimg: "https://files-cdn.cnblogs.com/files/cainiaoxiansheng/zfb2.bmp"},
weixin:{qrimg: "https://files-cdn.cnblogs.com/files/cainiaoxiansheng/wx1.bmp"},
}
};
</script>
<script src="https://files.cnblogs.com/files/mmzs/tctip.js"></script>

页脚Html代码：

设置完后，回到自己博客主页，看下页面显示，根据自己需要，去更改上列代码

转载于:https://www.cnblogs.com/beile/p/9714748.html

北乐博客装饰分享CSS+HTML+js相关推荐

你可能不知道的5种 CSS 和 JS 的交互方式
翻译人员: 铁锚翻译日期: 2014年01月22日原文日期: 2014年01月20日原文链接: 5 Ways that CSS and JavaScript Interact That You ...
【分享】常用JS（2）
============================================== 1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 ...
用javascript预加载图片、css、js的方法研究
预加载的好处可以让网页更快的呈现给用户,缺点就是可能会增加无用的请求(但图片.css.js这些静态文件可以被缓存),如果用户访问的页面里面的css.js.图片被预加载了,用户打开页面的速度会快很多,提 ...
javascript预加载图片、css、js的方法研究
预加载的好处可以让网页更快的呈现给用户,缺点就是可能会增加无用的请求(但图片.css.js这些静态文件可以被缓存),如果用户访问的页面里面的css.js.图片被预加载了,用户打开页面的速度会快很多,提 ...
html与css与php的关系,HTML、PHP、CSS、JS之间的关系
23:02:06 2019-08-05 自己要搭建网站虽然可以下载大佬的界面但至少要懂一点web开发的知识我现在感觉像个憨憨啥都不明白 HTML负责放你需要显示的内容, 而PHP可以输出可变化 ...
分享99个JS幻灯片代码，总有一款适合您
分享99个JS幻灯片代码,总有一款适合您 99个JS幻灯片代码下载链接:https://pan.baidu.com/s/1n8UQ41cem0GmgsOXCq9kMw?pwd=m5zf 提取码:m5 ...
如何用 CSS + HTML + JS 创建桌面应用
05月 31 Node 如何用 CSS + HTML + JS 创建桌面应用 | https://h.lishaoy.net/nwjsElectronjs.html || 最近研究了一下基于 Chro ...
分享116个JS图片代码，总有一款适合您
分享116个JS图片代码,总有一款适合您 116个JS图片代码下载链接:https://pan.baidu.com/s/1ebJsZ5s3GAhetqfJiA1ohg?pwd=e973 提取码:e9 ...
分享111个JS文字特效，总有一款适合您
分享111个JS文字特效,总有一款适合您 111个JS文字特效下载链接:https://pan.baidu.com/s/1Ql-wGwfjovvu78bvpwD-8w?pwd=wqgg 提取码:wq ...

北乐博客装饰分享CSS+HTML+js

北乐博客装饰分享CSS+HTML+js相关推荐

最新文章

热门文章