以下是几款个人空间摸版及CSS代码:
第一款:可爱的猫猫
点击查看大图:
代码如下:怎么添置代码,可以查看我的博客模版素材。
/*
blogworld Template
Template Name:鱦
Author:blogworld Team
Url:www.blogworld.com.cn
(C) 2001-2006 Comsenz Inc.
*/
body{background:url(http://template.blogworld.com.cn/class18/template116/images/wrap.jpg) repeat-y center top;color:#777;font:75%/150% Arial,Helvetica,sans-serif,"";margin:0;padding:0;text-align:center}
a{
color:#FD728B;
text-decoration:none;
}
a:hover{color:#777; text-decoration:none}
#wrap{
margin:0 auto;
overflow:hidden;
text-align:center;
background:url(http://template.blogworld.com.cn/class18/template116/images/header.jpg) no-repeat center top;
}
/*****************/
#header{ height:320px;margin:0px auto;text-align:left;width:996px; display:block; overflow:hidden;}
#spacename{padding-top:25px; padding-left:200px; font-size:12px; color:#B54F67;}
#menu{margin-left:90px; margin-top:160px; margin-right:90px; padding:5px 90px 0px 90px; height:23px;}
#xspace-menu li {margin-left:15px; display:inline;}
#menu a{color:#D81A1A;font-size:14px;text-decoration:none}
#menu a:hover{color:#FD728B;font-size:14px;text-decoration:none}
#xspace-guide { color:#FD728B;}
#xspace-guide a { color:#FD728B;}
#xspace-guide a:hover{ color:#C33E56;}
/**/
#content{
margin:25px auto;
text-align:left;
width:830px;
}
/*Layout_1*/
.xspace-layout1 #sideleft { float:left; width: 210px; margin-left:5px; display:inline;}
.xspace-layout1 .mainarea-side { width:600px; text-align:left; margin-right:5px;}
.xspace-layout1 #xspace-guide {margin-bottom:9px}
/*Layout_2*/
.xspace-layout2 #sideright {
float: right;
width: 210px;
margin-right:5px;
display:inline;
}
.xspace-layout2 .mainarea-side { float: left; width:600px; margin-left:5px; display:inline;}
.xspace-layout2 #xspace-guide {margin-bottom:9px}
/*Layout_3*/
.xspace-layout3 #sideleft { float:left; width: 210px; margin-left:5px; display:inline;}
.xspace-layout3 #sideright { float:right; width: 210px; margin-right:5px; display:inline;}
.xspace-layout3 .mainarea-side {float: left;width: 370px;margin: 0px 8px; padding:0px 5px;display:inline;}
.xspace-layout3 .mainarea-side-single { margin-left:3px;}
.xspace-layout3 #xspace-guide{ }
/*****************/
#sideleft{text-align:left; width:210px!important; padding-bottom:0px;}
#sideright{width:210px!important; padding-bottom:0px;}
#sideleft .xspace-sideblock{
margin-bottom:0px;
margin-top:0px;
padding-bottom:10px;
}
#sideright .xspace-sideblock{
margin-bottom:0px;
margin-top:0px;
padding-bottom:10px;
}
#sideleft .xspace-list {width:200px!important;overflow:hidden; margin:0px auto;}
#sideright .xspace-list {width:200px; margin:0px auto;}
#sideleft .xspace-list {}
.xspace-sideblock .xspace-blocktitle {
background:url(http://template.blogworld.com.cn/class18/template116/images/mod.gif) no-repeat left bottom;
height:26px;
font-size:12px;
text-decoration:none;
color:#000;
padding:3px 0px 0px 40px;
text-align:justify;
}
/**/
#xspace-avatar {
background:url(http://template.blogworld.com.cn/class18/template116/images/mod.gif) no-repeat left bottom;
text-align: center;
padding-top: 40px;
}
/*****************/
.xspace-layout1 #guide ,.xspace-layout2 #guide {margin-bottom:34px}
.xspace-layout3 #mainarea {padding-top:31px; text-align:left;}
#mainarea .xspace-blocktitle{
color:#997135;
font-size:14px;
text-indent: 12px;
margin: 8px 0px;
padding: 6px 0px 0px;
height:31px;
border-bottom:#FAE4E7 1px solid;
}
#mainarea .xspace-title{
border-bottom:#FAE4E7 1px solid;
color:#A5916B;
font-size:14px;
text-indent: 12px;
margin: 8px 0px;
padding: 4px 0px 0px;
height:31px;
text-align:center;
}
#announcement {
margin-left:8px;
margin-right:5px;
border:#FAE4E7 1px solid;
}
#mainarea .xspace-entrytitle {color:#B88B54; font-size:14px; padding-top:3px; padding-left:10px;}
.xspace-loglist { display:block; overflow:hidden;}
.xspace-smalltxt{color:#646464}
#xspace-calendar {color:#646464;}
.xspace-list {margin-left:0px; padding-bottom:5px}
.xspace-list li,.xspace-list2col li{padding-right:5px;}
.xspace-logo{background:none!important;}#xspace-goodsbaseinfo li { border-bottom: none!important;}
#xspace-ownerinfo{ border: none; }
/**/
.xspace-itemlist {margin:0;}
.xspace-itemlist li {border-bottom:#FAE4E7 1px solid;}
/**/
.xspace-msgmodule h5 { border-bottom: 1px solid #9060B6; }
/**/
.xspace-addoninfo { border: 1px solid #fff}
/**/
#xspace-aplist th, #xspace-aplist td { border-bottom: 1px solid #B88B54 }
#xspace-aplist .xspace-darkrow { background: #999; }
#xspace-aplist .xspace-ontop td { background: #D8A32C; }
#xspace-ownerinfo { border: 1px solid #B88B54;}
/**/
#xspace-goodsbaseinfo li { border-bottom: 1px solid #B88B54 }
/**/
.xspace-imagebox { border: 1px solid #B88B54 }
.xspace-multipage {margin-top:6px; clear:both;}
#xspace-imgnavbar { border-bottom: 1px solid #B88B54 }
/**/
.xspace-imgstyle. { background: #F9F9F9!important; border: 1px solid #B88B54; padding: 4px;}
li.xspace-avatarlist { float: left; padding: 4px; width: 58px; height: 73px; w\idth: 48px; he\ight: 63px; margin: 2px; text-align: center; overflow: hidden; }
/**/
#xspace-filebaseinfo li { border-bottom: 1px solid #B88B54 }
/**/
.xspace-msgmodule h5 { border-bottom: 1px solid #9060B6 }
/**/
.xspace-listtab a {color:#EA92B4}
.xspace-listtab a:hover {color:#F60;}
.xspace-listtab li.xspace-active a {color:#fff; font-size:12px}
/**/
.xspace-page { margin: 0.4em 0 0.4em auto; }
.xspace-page td { font-size: 11px; }
table.xspace-page a { color: #A5916B;display: block; background: #B88B54; padding: 0.3em 0.5em; text-decoration: none; }
table.xspace-page a:hover { text-decoration: underline; color: #F60;}
table.xspace-page td.xspace-current { background: #D8A32C; padding: 0.3em 0.5em; font-weight: bold; }
table.xspace-page td.xspace-totlerecord, table.xspace-page td.xspace-totlepages { background: #B88B54; padding: 0.3em 0.5em; color: #A5916B;}
/**/
li.xspace-loglist h4.xspace-entrytitle {
background:none;
line-height: 2em;
padding-left: 0.2em;
border-bottom:#FAE4E7 1px solid;
}
/**/
#xspace-search {
text-align: center;
}
/**/
#xspace-action {
width:180px; margin:0px auto; display:block;
padding-left:10px;
}
/**/
.xspace-manage { float: right !important; background: #627D90 !important; color:#B88B54 !important; text-decoration: none !important; font-size: 12px !important; font-weight: normal !important; line-height: 1.6em !important; height: 17px !important; overflow: hidden; padding: 0 3px; }
/**/
.xspace-itemlinks { margin: 0; padding: 0.3em 0; }
.xspace-itemlinks a, .xspace-itemlinks em {border-right: 1px solid #997135; color: #997135; font-style. normal;}
.xspace-itemlinks a:hover {color: #ff7E00;}
/*show*/
#show { padding:0 3px 0 8px;}
.more { padding-right:28px;}
/*****************/
#xspace-footer_menu {padding-top:20px;}
#xspace-footer{background:url(http://template.blogworld.com.cn/class18/template116/images/footer.jpg) no-repeat center bottom; color:#494747;height:123px;margin:0px auto; text-align:center;}
#xspace-footer a {font-size: 12px;color:#494747;text-decoration: none;}
#xspace-footer a:hover {font-size: 12px;color: #494747;text-decoration: none;}
第二款:蓝 喜欢蓝色的朋友可以把它设置自已的模版。
点击查看大图:下图
代码如下:具体操作可以查看我的博客,那里有简单的流程说明怎么添入代码,让自已的博客与众不同。
/*
blogworld Template
Template Name:blogworld
Author:blogworld Team
Url:www.blogworld.com.cn
(C) 2001-2006 Comsenz Inc.
*/
html{ border-right:1px solid #ccc;}
body{margin:0;padding:0;background:#234489;color:#010066;font:75%/150% Arial, Helvetica, sans-serif, "宋体";text-align:left}
a{color:#070648;text-decoration:none}
a:hover{color:#f60;text-decoration:none}
#wrap{text-align:left;
background:none;
overflow:hidden;margin:0 auto;
width:960px;
}
/********头部 *********/
#header{
color:#000;height:213px;margin:0px auto;text-align:left;padding:0 40px;
background:url(
http://template.blogworld.com.cn/class16/template49/images/top.jpg) no-repeat center top;
}
#spacename{padding-top:0px;margin-left:20px; color:#fff;}
#menu{
margin-top:73px;
margin-left:0px;
}
#menu li{ height:24px;}
#menu li a{
color:#fff;
font-size:14px;
text-decoration:none;
line-height:28px;
padding:0px 10px 0px 10px;
}
#menu a:hover{color:#000;font-size:14px;text-decoration:none}
/*默认布局*/
#content{
margin:0px auto;
background:url(
http://template.blogworld.com.cn/class16/template49/images/content.jpg) repeat-y center top;
width:960px;
}
/*Layout_1 左侧导航*/
.xspace-layout1 #sideleft {
float:left;
width: 220px;
margin-top:5px;
padding-left:55px;
}
.xspace-layout1 .mainarea-side {
width:610px;
margin-left:300px;
margin-top:5px;
}
/*Layout_2 右侧导航*/
.xspace-layout2 #sideright {
float: left; width: 220px;margin-left:30px;margin-top:5px;}
.xspace-layout2 .mainarea-side {
padding-left:55px;width:610px;
margin-top:5px;}
/*Layout_3 三列*/
.xspace-layout3 #sideleft { float:left; width:220px;margin-top:5px;padding-left:8px;}
.xspace-layout3 #sideright { float:right; width:220px;margin-top:5px;
padding-right:6px;}
.xspace-layout3 .mainarea-side {
float: left;
width: 486px;
margin-left:9px;margin-top:5px;
}
.xspace-layout3 .mainarea-side-single { margin-left: 3px; }
/********边栏定义*********/
#sideleft{
width:220px!important;
margin-left:0px;
background: none;
}
#sideright{
width:220px!important;
margin-left:0px;
background:none;
}
#sideright .xspace-sideblock{padding-right:0px!important;
background: url(
http://template.blogworld.com.cn/class16/template49/images/leftbottom.jpg) no-repeat center bottom;
padding-bottom:8px;}
#sideleft .xspace-sideblock{
padding-right:0px!important;
background: url(
http://template.blogworld.com.cn/class16/template49/images/leftbottom.jpg) no-repeat center bottom;
padding-bottom:8px;
}
#sideleft .xspace-list,#sideleft #xspace-calendar{width:215px!important;overflow:hidden}
.xspace-list li{margin-bottom:10px; margin-right:1px;
margin-left:11px!important;margin-left:7px;}
.xspace-layout1 #avatar {}
.xspace-layout3 #avatar {}
.xspace-layout2 #avatar {}
.xspace-sideblock .xspace-blocktitle {
background:url(
http://template.blogworld.com.cn/class16/template49/images/left.jpg) no-repeat center top;
padding:8px 0 0;
font-size:14px;
text-decoration:none;
color:#000;
line-height:1.6em;
padding-left: 25px;
height:30px;
}
#xspace-search{ padding-left:18px; padding-bottom:8px;}
#xspace-action{ margin-left:10px; margin-right:10px; padding-bottom:8px; }
.xspace-sideblock a{ margin:0px; padding:0px;}
#xspace-avatar{
background: url(
http://template.blogworld.com.cn/class16/template49/images/left.jpg) no-repeat center top;
padding-top:55px;}
/********主体内容定义*********/
#mainarea .xspace-blocktitle{
background:url(
http://template.blogworld.com.cn/class16/template49/images/right.jpg) no-repeat center top;
color:#000;
font-size:14px;
padding-left:10px!important;
padding-top:8px;
padding-bottom: 6px;
}
#mainarea .xspace-title{
background:none;
color:#000;
font-size:14px;
padding-left:0px!important;
padding-top:8px;
padding-bottom: 6px;
text-align: center;
}
#mainarea .xspace-entrytitle{color:#193A44;font-size:14px}
#announcement,#show{margin-top:20px; border: none!important;}
.xspace-smalltxt{color:#010066}
#xspace-goodsbaseinfo li { border-bottom: none!important;}
#xspace-ownerinfo{ border: none; }
.xspace-logo{background:none!important;}
.xspace-itemmessage { margin: 0 auto; width: 97%; overflow: auto; overflow-y: hidden; line-height: 1.8em; }
/*项目列表*/
.xspace-itemlist {margin:0;}
.xspace-itemlist li { border-bottom: 1px solid #fff!important;}
/*信息正文中的模块*/
.xspace-msgmodule h5 { border-bottom: 1px solid #fff; }
/*自定义字段*/
.xspace-addoninfo { border: 1px solid #193A44}
/*出价记录*/
#xspace-aplist th, #xspace-aplist td { border-bottom: 1px solid #f00 }
#xspace-aplist .xspace-darkrow { background: #ccc; }
#xspace-aplist .xspace-ontop td { background: #ddd; }
#xspace-ownerinfo { border: 1px solid #193A44;}
/*商品基本信息*/
#xspace-goodsbaseinfo li { border-bottom: 1px solid #193A44 }
/*图片显示页面*/
.xspace-imagebox { border: 1px solid #193A44 }
.xspace-multipage {margin-top:6px; clear:both;}
#xspace-imgnavbar { border-bottom: 1px solid #193A44 }
/*文件显示页面*/
#xspace-filebaseinfo li { border-bottom: 1px solid #193A44 }
/*信息正文中的模块*/
.xspace-msgmodule h5 { border-bottom: 1px solid #193A44 }
/*Tab选项卡*/
.xspace-listtab a { background: #EEE; color:#333}
.xspace-listtab li.xspace-active a { color:#000; font-size:12px}
/* 分页 */
table.xspace-page a { color: #193A44;}
/*卖家信息*/
#xspace-ownerinfo {border: 1px solid #193A44;padding: 10px;float: left;margin-top: 205px;margin-left: -200px;width: 200px;w\idth: 178px;}
/*自定义字段*/
.xspace-addoninfo { border: 1px solid #193A44; padding: 5px; margin: 1em 0px; }
/*信息正文中的模块*/
.xspace-msgmodule { margin: 2em 0; }
.xspace-msgmodule h5 { margin: 0.3em 0; font-size: 1em; border-bottom: 1px solid #193A44; }
/*TAG*/
.xspace-itemtag { margin: 1em 0; padding: 0.4em 7em 0.4em 3.5em; line-height: 1.5em; font-weight: bold; text-indent: -2.4em; border: 1px solid #193A44; }
.xspace-itemtag a { font-weight: normal; padding-left: 0.5em; }
/*图片样式*/
.xspace-imgstyle. { background: #F9F9F9; border: 1px solid #193A44; padding-top: 4px; }
/*日志列表*/
li.xspace-loglist h4.xspace-entrytitle { background: none; line-height: 2em; padding-left: 0.2em; }
/*文章底部链接*/
.xspace-itemlinks { margin: 0; padding: 0.3em 0; color: #000;}
.xspace-itemlinks a, .xspace-itemlinks em { padding-right:0.4em; margin-right: 0.2em; border-right: 1px solid #193A44; font-style. normal; }
.xspace-rategood { color: #F90; } .xspace-ratebad { color: #000; }
.xspace-loglist { display:block; overflow:hidden;}
/*提示信息*/
.xspace-noticemsg { border: 1px solid #193A44; padding: 2em 1em; text-align: center; }
/*评论列表*/
#xspace-itemreply {
padding: 0px;
margin-top: 1em;
margin-bottom: 1em;
width:98%;
}
/********页面底部定义*********/
#xspace-footer{background:url(
http://template.blogworld.com.cn/class16/template49/images/foot.jpg) no-repeat center top;color:#fff;height:122px;margin:0px auto;padding-top:40px;text-align:center;}
#xspace-itemform. fieldset { border: 1px solid #193A44; padding: 1em; margin: 0; }
table.xspace-page a { display: block; background: #CCC; padding: 0.3em 0.5em; text-decoration: none; }
table.xspace-page td.xspace-current { background: #EEE; padding: 0.3em 0.5em; font-weight: bold; }
table.xspace-page td.xspace-totlerecord, table.xspace-page td.xspace-totlepages { background: #CCC; padding: 0.3em 0.5em; }
#xspace-aplist .xspace-darkrow { background: #EEE; }
#xspace-aplist .xspace-ontop td { background: #CCC; }
#xspace-rates a {
float: left; background: #EEE; color: #fff; text-decoration: none; width: 20px;
height: 20px; text-align: center; line-height: 20px; margin: 0 2px; opacity: 0.2;
filter: alpha(opacity=20); }
#xspace-rates a:hover { opacity: 1; filter: alpha(opacity=100); }
#xspace-footer_menu a{ color:#fff;}
#xspace-footer_menu a:hover{ color:#000;}
#xspace-copyright a{ color:#fff;}
#xspace-copyright a:hover{ color:#000;}
第三款:可爱女孩
点击查看大图看效果。
代码如下:
/*
blogworld Template
Template Name:时间记忆
Author:blogworld Team
Url:www.blogworld.com.cn
(C) 2001-2006 Comsenz Inc.
*/
body{background:#000 url(
http://template.blogworld.com.cn/class17/template36/images/bg.jpg) repeat-y center top;color:#6C6C6C;font:75%/150% Arial,Helvetica,sans-serif,"宋体";margin:0;padding:0;text-align:center}
a{color:#000000;text-decoration:none}
a:hover{color:#C02FA6;text-decoration:none}
#wrap{background:url(
http://template.blogworld.com.cn/class17/template36/images/top.jpg) no-repeat center top;margin:0 auto;overflow:hidden;text-align:center;width:920px}
/********头部 *********/
#header{color:#FFFFFF;height:595px;margin:0px auto;text-align:left;width:740px}
#spacename{padding-top:25px}
#menu{margin-top:437px;margin-left: 40px;}
#menu a{
color:#FFFFFF;
font-size:13px;
text-decoration:none;
font-weight: bold;
}
/*默认布局*/
#content{margin:0px auto;text-align:left;width:900px}
/*Layout_1 左侧导航*/
.xspace-layout1 #sideleft { float:left; width: 247px; }
.xspace-layout1 .mainarea-side { margin-left: 27%; }
/*Layout_2 右侧导航*/
.xspace-layout2 #sideright { float: right; width: 247px; }
.xspace-layout2 .mainarea-side { float: left;}
/*Layout_3 三列*/
.xspace-layout3 #sideleft { float:left; width:188px; }
.xspace-layout3 #sideright { float:right; width: 188px; margin-top:16px;}
.xspace-layout3 .mainarea-side {
float: left;
width: 510px;
margin-right: 5px;
margin-left: 5px;
}
.xspace-layout3 .mainarea-side-single { margin-left: 27%; }
/********边栏定义*********/
#sideleft{}
#sideright{}
#sideleft .xspace-sideblock{padding-right:5px!important;}
#sideleft .xspace-list,#sideleft #xspace-calendar{width:160px!important;overflow:hidden}
.xspace-layout1 #avatar { padding-top:35px;}
.xspace-layout3 #avatar { padding-top:35px;}
.xspace-layout2 #avatar { background:none;padding-top:35px;}
.xspace-sideblock .xspace-blocktitle {
background: url(
http://template.blogworld.com.cn/class17/template36/images/index_00.gif) no-repeat left bottom;
padding-top:8px;
color:#333;
font-size:14px;
height: 30px;
text-align: left;
padding-left: 19px!important;
}
/********主体内容定义*********/
#mainarea .xspace-blocktitle{
color:#000000;
font-size:14px;
padding-left:6px!important;
padding-top:4px;
padding-bottom:4px;
border-top: 1px solid #04309B;
border-bottom: 1px solid #04309B;
}
#mainarea .xspace-title{color:#000000;
font-size:14px;
padding-left:6px!important;
padding-top:4px;
padding-bottom:4px;
border-top: 1px solid #04309B;
border-bottom: 1px solid #04309B;}
#mainarea .xspace-entrytitle{color:#333333;font-size:13px}
#announcement,#show{margin-top:20px}
.xspace-smalltxt{color:}
.xspace-list li,.xspace-list2col li{}
.xspace-logo{background:none!important;}#xspace-goodsbaseinfo li { border-bottom: none!important;}
#xspace-ownerinfo{ border: none; }
.xspace-logo{background:none!important;}
/*项目列表*/
.xspace-itemlist {margin:0;}
.xspace-itemlist li { border-bottom: 1px solid #999!important; }
/*信息正文中的模块*/
.xspace-msgmodule h5 { border-bottom: 1px solid #999; }
/*自定义字段*/
.xspace-addoninfo { border: 1px solid #999}
/*出价记录*/
#xspace-aplist th, #xspace-aplist td { border-bottom: 1px solid #999 }
#xspace-aplist .xspace-darkrow { background: #ccc; }
#xspace-aplist .xspace-ontop td { background: #ddd; }
#xspace-ownerinfo { border: 1px solid #999;}
/*商品基本信息*/
#xspace-goodsbaseinfo li { border-bottom: 1px solid #999 }
/*图片显示页面*/
.xspace-imagebox { border: 1px solid #999 }
.xspace-multipage {margin-top:6px; clear:both;}
#xspace-imgnavbar { border-bottom: 1px solid #999 }
/*文件显示页面*/
#xspace-filebaseinfo li { border-bottom: 1px solid #999 }
/*信息正文中的模块*/
.xspace-msgmodule h5 { border-bottom: 1px solid #999 }
/*Tab选项卡*/
.xspace-listtab a { background: #EEE; color:#333}
.xspace-listtab li.xspace-active a { color:#333; font-size:12px}
/* 分页 */
table.xspace-page a { color: #000;}
/********页面底部定义*********/
#xspace-footer{
background:url(
http://template.blogworld.com.cn/class17/template36/images/foot.jpg) no-repeat center bottom;
color:#000000;
height:142px;
margin:0px auto;
text-align:center;
width:996px;
padding-bottom: 45px;
}
附件:
蓝色心 [时间:2008-6-13 10:53]
可爱女孩子大图 [时间:2008-6-13 11:18]
可爱猫猫大图 [时间:2008-6-13 11:26]