我的页面定制CSS代码(SimpleGamboge皮肤)

我的页面定制CSS代码,针对博客园SimpleGamboge皮肤。

调整:

1、左上图片更换为自己的头像

2、扩大左侧栏宽度,缩小右侧主栏宽度宽度

3、扩大内容页面的评论区宽度,工具图标靠左

4、去广告……

5、拉伸状态下,左侧栏固定宽度,右侧栏适应(by grace)

 

/*左上头像*/
#lnkBlogLogo {
float: right;
display: block;
width: 180px; /*调整*/
height: 180px; /*调整*/
background-image: url(http://pic.cnitblog.com/avatar/694556/20141120153630.png); /*调整*/
}
 
/*左侧栏*/
#header {
width: 180px; /*调整*/
min-width:180px;
color: #000;
background: #FFF;
}
@media screen and (max-width: 1000px){
#header, #sideBar {
display:block;
}}

#sideBar {
width: 180px; /*调整*/
min-width: 180px; /*调整*/
min-height: 200px;
float: left;
text-align: right;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
}
.input_my_zzk {
width: 100px; /*调整input text*/
}
 
/*右侧主栏*/
#mainContent .forFlow {
position: absolute;
top: 0;
left:200px;
right: 0;
float: right;
width: initial;
min-height: 1000px;
min-width: 800px;
background: #F6E497;
}
  
/*评论区*/
div.commentform textarea {
width: 100%; /*调整*/
height: 300px;
font-size: 13px;
}
.commentbox_title_right {
float: left; /*调整*/
height: 22px;
}
 
/*下广告*/
#site_nav_under {
margin-top: 5px;
line-height: 1.8;
display: none; /*调整*/
}
.c_ad_block {
margin-top: 10px;
line-height: 1.5;
display: none; /*调整*/
}

  

 

 

P.S. 原来大概长这样 

http://www.cnblogs.com/zlf344242525/

posted @ 2014-11-20 16:11  protein  阅读(507)  评论(0编辑  收藏  举报