关于博客园首页及详情页美化的代码

1、博客皮肤选择 darkgreentrip。

2、然后在页面定制 css代码里边输入以下css代码就好了。(由于时间问题,我把广告给注掉了,大家尽量保留广告)

/* 注释掉头部分 */
#blogTitle
{ display: none; }
/* 注释菜单里边的首页 */ #navList li:first-child { display: none; }
/* 修改菜单背景颜色,并设置固定在顶部 */ #navigator { background-color: #c05328; height: 45px; line-height: 45px; overflow: hidden; clear: both; position: fixed; width: 100%; }
/* 调整下边距 */ #navList a { display: block; padding: 0 1em; height: 45px; font-family: '微软雅黑'; float: left; font-size: 1em; text-align: center; transition-duration: 0.3s; }
/* 调整内容部分距离顶部位置 */ #main { min-width: 950px; text-align: left; padding: 55px 0 0 10px; overflow: hidden; }
/* 调整底部样式 */ #footer { text-align: center; min-height: 15px; border-top: 1px solid #d2d8de; line-height: 30px; background-color: #c5c19a; color: #fff; margin-top: 0px; padding-top: 0px; margin-bottom: 0px; }
/* 调整左侧大类头背景颜色 */ .catListTitle { background: #a49207; border-bottom: 1px solid #a49207; border-top-left-radius: 7px; border-top-right-radius: 7px; color: #FFFFFF; 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); }
/* 调整菜单默认颜色 */ #navList a:link, #navList a:visited, #navList a:active { color: #fffcfc; }
/* 调整菜单选中颜色*/ #navList a:hover { color: white; background-color: #d28a1d; text-decoration: none; text-shadow: 0px 0px 1px #d28a1d; }
/* 调整菜单右侧字体颜色 */ .blogStats { color: #fff; text-align: right; }
/* 屏蔽广告 */ .c_ad_block { display: none; }
/* 屏蔽广告 */ #ad_t2 { display: none; }
/* 调整评论输入框 */ div.commentform textarea { width: 100%; } .commentbox_title_right { float: left; } #comment_form_container { margin-top: 20px; background-color: #fff; border-radius: 5px; padding: 15px; } .comment_btn { height: 30px; width: 68px; margin: 0; padding: 0; line-height: 30px; } #commentbox_opt a { padding-left: 10px; font-size: 12px; font-family: 微软雅黑; } #blog-comments-placeholder { background-color: #fff; border-radius: 5px; padding: 15px; margin-bottom: 20px; } #comment_nav { text-align: right; position: fixed; width: 60px; height: 90px; bottom: 20px; right: 20px; }

/* 修改返回顶部样式*/ #comment_nav a { padding-left: 10px; display: none; } #comment_nav a:last-child { display: block; background-color: #844848; width: 30px; padding: 10px 15px; border-radius: 50%; color: #fff; }

 

posted @ 2017-11-07 17:13  codermen  阅读(540)  评论(0编辑  收藏  举报