您的位置:首页 > Web前端 > CSS

自己写的CSDN博客css样式

2011-01-18 21:04 363 查看
突然觉得自己的博客样式过于单调,于是动手修改之,css代码如下:

/*页面body块样式*/
body{
background:#DBDBDB;
text-align:center;
}
/*整体页面样式*/
#csdnblog_allwrap{
width:900px;
height:auto;
}
/*页面边栏*/
#csdnblog_sidebar{
width:280px;
position:absolute;
left:1000px;
top:115px;
}
/*页面正文*/
#csdnblog_content{
width:1000px;
position:absolute;
left:0px;
top:112px;
background:#FFFFFF;
}
/*页面头部块*/
#csdnblog_header{
width:1245px;
height:120px;
background:#8F8F8F;
position:absolute;
left:0px;
top:0px;
}

/*页面查询块*/
#csdnblog_header ul#blogsearchsty{
float:left;
position:absolute;
top:50px;
right:0px;
float:right;
}
/*页面菜单块*/
#csdnblog_header ul#menu{
height:25px;
float:left;
top:90px;
position:absolute;
width:auto;
left:923px;
font-size:12px;
background:#DBC160;
border:1px solid black;
}
#csdnblog_header ul#menu li{
float:left;
width:80px;
text-align:center;
color:#FFFFFF;
}
#csdnblog_header ul#menu li a{
float:left;
color:#FFFFFF;
padding:0 0 0 0;
margin:0 0 0 0;
width:80px;
}
#csdnblog_header ul#menu li a:hover{
color:#7AD67D;
text-decoration:underline;
}

/*页面尾部块*/
#pubfooter{
position:absolute;
left:0px;
}

/*右侧个人blog资料信息块(外)*/
#csdnblog_sidebar {
DISPLAY: inline;
FLOAT: left;
MARGIN: 2px 0px 0px;
TEXT-ALIGN: left;
background-color:#96B0ED;
width:245px;
}
/*右侧个人blog资料信息块(内)*/
#csdnblog_sidebar DIV.gutter {
DISPLAY: inline;
FLOAT: left;
MARGIN: 5px 6px;
OVERFLOW: hidden;
WIDTH:234;
FONT-FAMILY: "Microsoft yahei",verdana,sans-serif;
background-color:#CDD8FA;
}
.aboutauthor dl dt{
border:0px;
width:212px;
height:30px;
padding-top:5px;
}
/*登录,注册菜单选项或已登录用户的菜单项*/
/*页面个人blog菜单管理块*/
#csdnblog_header ul#personalnav{
float:right;
margin:0 1em;
position:absolute;
top:1px;
right:0px;
}

#csdnblog_header UL#personalnav LI A#a_register {
background-color:#c8db4a ;
border:2px dashed #c8db4a;
text-align:center;
color:#fff;
}
#csdnblog_header UL#personalnav LI A#a_register:hover {
background-color:#8CB5F2;
border:2px dashed #8CB5F2;
text-align:center;
color:#000;
text-decoration:underline;
}
#csdnblog_header UL#personalnav LI A {
background-color:#8CB5F2;
border:2px dashed #8CB5F2;
text-align:center;
color:#fff;
}
#csdnblog_header UL#personalnav LI A:hover {
background-color:#c8db4a ;
border:2px dashed #c8db4a;
text-align:center;
color:#000;
text-decoration:underline;
}
.new {
position: absolute;
top: 0px;
right: 0px;
z-index: 200;
height:auto;
}
.default_contents{
border:1px dashed ;
}

注:该css样式将个人信息栏放到了右侧!我将页面头部、边侧栏和正文部分设置为绝对路径,发现顶部的导航条和最下方的版权声明被覆盖了...暂时先不修改,若涉及到CSDN官方的利益问题我再做处理~
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: