自定义自己的博客园博客首页

博客侧边栏公告：

联系我是通过腾讯QQ的方式联系我，会根据QQ的在线状态显示不同颜色的图标。

<!-- 头像 -->
<img class="divBlock" src="http://images.cnblogs.com/cnblogs_com/Candies/632934/o_mayun.jpg" style="height:300px;">
<!-- 企鹅 -->
企鹅：<a target="_blank" href="tencent://message/?uin=359031282&Menu=yes">
<img border="0" src="http://wpa.qq.com/imgd?IDKEY=0888b40d1f802a8ee4a15521b180d224ca321fb46fc82ce2&pic=51"
alt="Candyメ奶糖" title="Candyメ奶糖"></a>

页脚Html代码：

<!-- 站长统计 -->
<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1253650355'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s11.cnzz.com/z_stat.php%3Fid%3D1253650355%26online%3D1%26show%3Dline' type='text/javascript'%3E%3C/script%3E"));</script>
<!-- 微博分享 -->
<div id="share">
<a class="divBlock" href="http://weibo.com/u/1986192324" target="_blank" id="sina">　</a>
<a class="divBlock" href="http://t.qq.com/loverning" target="_blank" id="tent" >　</a>
</div>

<!-- 返回顶部 -->
<a href="javascript:" id="toTop" title="返回顶部"
onclick="window.scrollTo(0,0);return false;" style=""></a>

页面定制CSS代码

/*---------------------------------共通 Start---------------------------------*/
body {
margin: 0;
padding: 0;
font-family: 'Microsoft YaHei', 'Segoe UI', Tahoma, Arial, Helvetica,
sans-serif;
font-size: 14px;
vertical-align: top;
color: #000;
}

#main {
margin: 0 auto;
padding: 20px 0;
1024px;
}

#mainContent {
float: right;
790px;
}

a,a:hover,a:active,a:visited {
text-decoration: none;
color: #267CB2;
}

a:hover {
text-decoration: none;
color: #F60;
}

ul,li {
list-style: none;
}

ul {
margin: 0;
padding: 0;
}

/* 返回顶部 */
#toTop {
28px;
height: 65px;
position: fixed;
display: none;
right: 20px;
bottom: 65px;
background:
url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_backtop.png)
no-repeat 0px 0px;
opacity: 0.6;
}

#toTop:hover {
opacity: 1;
filter: alpha(opacity = 100);
background:
url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_backtop.png)
no-repeat -28px 0px;
}

/* 页脚微博 */
#share {
35px;
position: fixed;
right: 20px;
bottom: 150px;
}

#share a {
color: #333;
}

#share a#sina {
line-height: 3;
background: transparent
url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_WB_logo.png)
no-repeat 0px 0px;
}

#share a#tent {
line-height: 3;
background: transparent
url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_tx_wb_logo.png)
no-repeat 0px 0px;
}

/*
#share {
position:fixed;
bottom: 0px;
right: 0px;
450px;
margin: 0 auto;
border: 1px solid #CC0;
background: #F4FAED;
padding: 5px 10px 3px
}

#share a {
background: transparent
url(http://image.dili360.com/www/img/sharelogo.png) no-repeat scroll 0
0;
line-height: 1.8;
color: #333;
margin: 0 0 0 10px;
padding: 3px 0 3px 18px;
}

#share a#sina {
background-position: 0 -79px
}

#share a#tent {
background-position: 0 -129px
}

*/

/* 隐藏页脚 */
#footer {
background-color: #F1F4F4;
padding-top: 25px;
color: #333;
text-align: center;
}

#cnzz_stat_icon_1253650355 {
100%;
display: inline-block;
background-color: #F1F4F4;
padding-bootom: 25px;
text-align: center;
}

/*---------------------------------共通 End---------------------------------*/

/*---------------------------------导航栏 Start---------------------------------*/
#navList {
background:
url(http://images.cnblogs.com/cnblogs_com/libaoheng/435190/o_bg-tabs.png)
no-repeat center bottom;
border: none !important;
height: 52px;
text-align: center;
margin: 0 0 12px;
padding: 15px 0 1px;
font-size: 16px;
}

#navList li {
margin: 0;
display: inline-block;
vertical-align: bottom;
}

#navList a {
font-family: 'Microsoft YaHei';
color: #333;
text-decoration: none;
background: #D8E1EC
url(http://i1.asp.net/images/ui/sprite-ui.png?cdn_id=t32) repeat-x 0
-363px;
border: 1px solid #D8E1EC;
border-bottom: 0;
display: block;
padding: 16px 36px 0;
margin: 0;
position: relative;
top: 0;
text-align: center;
-moz-border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
min-height: 36px;
}

#navList a:hover,#MyLinks1_MyHomeLink {
background: white !important;
color: #000 !important;
border: 1px solid #CFD0D3 !important;
border-bottom: 0 !important;
-moz-box-shadow: 0 6px 0 #fff, 0 0 4px #bbb !important;
-webkit-box-shadow: 0 6px 0 white, 0 0 4px #BBB !important;
box-shadow: 0 6px 0 white, 0 0 4px #BBB !important;
}
/*---------------------------------导航栏 End---------------------------------*/

/*---------------------------------标题 Start---------------------------------*/
/* 博客标题 */
#blogTitle {
margin: 0 auto;
padding-left: 100px;
background-color: #D2D8DE;
height: 106px;
}

#blogTitle .title {
1024px;
margin: 0 auto;
padding: 26px 0 0;
}

#blogTitle h2 {
font-size: 14px;
font-weight: normal;
}

/* 标题 */
h1 {
margin: 0;
padding: 0;
}

h1.postTitle {
padding: 0;
background: #fff;
font-size: 24px;
}

h1.postTitle a {
color: #000;
text-decoration: none !important;
}

h3 {
margin: 10px 0;
padding: 0;
font-size: 14px;
}

h3.catListTitle {
color: #fff;
}
/*---------------------------------标题 End---------------------------------*/

/*---------------------------------侧边栏 Start---------------------------------*/
#sideBar {
min-height: 200px;
padding: 0px 0 0px 5px;
float: left;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
}

/* 不显示公告 */
.newsItem .catListTitle {
display: none;
}

/* 时钟 */
.divBlock,#honehoneclock {
display: block;
}

.blog-news {
margin-top: 5px;
line-height: 1.5;
text-align: left;
}

.catList,.catListTag,.mySearch,.catListLink,.catListPostCategory,.catListPostArchive,.catListBlogRank
{
border-radius: 7px;
border-bottom: 1px dotted #ccc;
}

.catListTitle {
background-color: #267CB2;
font-size: 16px;
border-bottom: 1px solid #006600;
border-top-left-radius: 7px;
border-top-right-radius: 7px;
font-size: 1.2em;
height: 1.8em;
line-height: 1.8em;
padding: 5px;
text-indent: 0.5em;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}

/* 加大随笔档案、随笔分类等列表间距 */
.catList ul li,.catListTag ul li,.catListLink ul li,.catListPostArchive ul li,.catListPostCategory ul li,.catListBlogRank ul li
{
padding: 5px 0px 5px 10px
}

/*---------------------------------侧边栏 End---------------------------------*/

/*---------------------------------博文列表 Start---------------------------------*/
/* 日期块、从随笔分类和随笔档案点开的一览页面 */
.day,.entrylistItem {
min-height: 10px;
_height: 10px;
background: #fff;
border-radius: 7px;
box-shadow: 1px 1px 2px #aaa;
margin: 0 5px 20px 0;
padding: 5px 20px 5px 20px;
}

/* 日期标题 */
.dayTitle {
color: #666;
line-height: 2.2em;
font-size: 22px;
clear: both;
border-bottom: 1px solid #ccc;
text-align: center;
}
/* 博文标题 */
.postTitle,.entrylistPosttitle {
font-size: 16px;
font-weight: bold;
padding: 3px 0 4px 24px;
border-bottom: 1px dashed #ccc;
line-height: 2.5em;
clear: both;
background:
url(http://images.cnblogs.com/cnblogs_com/Candies/632934/o_titile-icons.png)
no-repeat 0px 50%;
}

.postTitle a:link,.postTitle a:visited,.postTitle a:active,.entrylistPosttitle a:link,.entrylistPosttitle a:visited,.entrylistPosttitle a:active
{
transition: all 0.4s linear 0s;
}

/* 博文标题 */
.postTitle a:hover,.entrylistPosttitle a:hover {
color: #F60;
text-decoration: none;
margin-left: 10px;
}

/* 博文内容 */
.postCon,.entrylistPostSummary {
margin: 10px 0px;
}

.postDesc a {
display: none;
}

/* 博文post脚 */
.postDesc,.entrylistItemPostDesc {
text-align: right;
color: #999;
}

/* 不显示随笔档案-XX、随笔分类-XX和描述 */
.entrylistTitle,.entrylistDescription {
display: none;
}
/*---------------------------------博文列表 End---------------------------------*/

/*---------------------------------博文内容页面 Start---------------------------------*/

/* 博客签名 */
#MySignature {
/*background:url("http://images.cnblogs.com/cnblogs_com/Candies/632934/o_o_light2.png") no-repeat 10px 50%;*/
background:
url("http://images.cnblogs.com/cnblogs_com/Candies/632934/o_may.png")
no-repeat 20px 40%;
margin-top: 20px;
padding: 10px 10px 10px 120px;
box-shadow: 0px 0px 15px #aaa;
border-radius: 25px;
border: 1px dotted #FFD596;
}

#MySignature a {
color: #FB9400;
}

/* 屏蔽广告 */
#site_nav_under,#ad_under_post_holder,#google_ad_c2 {
display: none;
}

/*博客目录*/
#sideBarView {
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
text-align: left;
position: fixed;
/*将div的位置固定到距离top:50px，right:0px的位置，这样div就会处在最右边的位置，距离顶部50px*/
top: 299px;
right: 30px;
auto;
height: auto;
}

#sideBarTab {
float: left;
30px;
border: 1px solid #e5e5e5;
border-right: none;
text-align: center;
background: #ffffff;
background-color: #F1F4F4;
border-radius: 5px;
}

#sideBarContents {
float:left;
overflow:auto;
overflow-x:hidden;!important;
padding:10px;
min-height: 108px;
max-height: 460px;
border: 1px solid #e5e5e5;
background: #ffffff;
border-radius: 5px;
}

#sideBarContents dl {
margin-top: 15px;
margin-bottom: 15px;
padding: 0;
}

#sideBarContents dt {
margin-top: 15px;
margin-left: 5px;
}

#sideBarContents dd,dt {
cursor: pointer;
-webkit-margin-start:0px;
}

#sideBarContents dd:hover,dt:hover {
color: #A7995A;
}

.blog_comment_body {
border-radius: 15px;
box-shadow: 0px 0px 15px #aaa;
border: 2px solid #FFD596;
display: inline-block;
margin: 10px 0px;
padding: 15px;
position: relative;
}
/*---------------------------------博文内容页面 End---------------------------------*/

页首Html代码

<script type="text/javascript">
    function toTopHide(){
        $(document).scrollTop()>1000?
                $("#toTop").show()
                    :$("#toTop").hide();
    }
    $(window).scroll(function(){toTopHide()});
</script>