[教学]更改部落格的背景及头部图像

童話王子

先声明：自己不是IT 人员，只是个人的兴趣 + 无聊时摸索出来的。很多语法也只知其字，而不知其意的。如果有什么错误，就请大家多多指教咯！

= = = = = = = = = = = = = = = = = == = = = = = = = = = = = = = = = = = = = = == = =

今天教大家利用css语法来更改当前的部落格背景及头部图像。





事先步骤：
1. 准备图像（没有的话，可以键入‘部落格 + 素材’利用google或yahoo 搜索）。
为了整齐美观，建议头部图像的高度Height为500 px，宽度则没有限制。
2. 把图像上传到网络空间，如photobucket.com
3. 记下图像的网址
  

修改css语法的步骤：
4. 进入空间管理 > 模板 > 编辑我的风格主题
5. 按下另存为...，输入Backup以作备份，按保存css。






当我们错误地删除某段语法时，这个步骤（Backup）可以让我们回到之前的设定。




6.使用范列里的语法，输入相关的图像网址，然后把语法贴在语法框里。（注意：必须先清空之前使用的语法）
如果语法太小看不清楚，你可以先复制语法到MS Word，输入后再贴在语法框即可。
7. 按保存修改

8. 到首页观看效果。




= = = = = = = = = = = = = = = = = == = = = = = = = = = = = = = = = = = = = = = = =

范列：
body{margin: 0; padding: 0; background: #000 url(输入背景图像的网址) fixed; repeat-x;repeat-yleft top; color: #000; font: 12px Arial, Helvetica, sans-serif;”宋体” }
a{color:#000;text-decoration:none}
a:hover{color: #4040ff;text-decoration:none}
#wrap{text-align:left;background:url(输入背景图像的网址) repeat-x;repeat-y centertop;overflow:hidden;margin:0 auto;width:996px;}

/********头部*********/
#header{color:#000;height:515px;background:url(输入头部图像的网址) no-repeat centertop;margin:0 auto;overflow:hidden;text-align:left;width:850px;padding:0 100px}
#spacename{padding-top:25px}
#menu{margin-top:350px;margin-left:10px;}
#menua{color:#000;font-size:16px;text-decoration:none}

/*默认布局*/
#content{margin:0px auto;text-align:left;width:900px}
/*Layout_1 左侧导航*/
.xspace-layout1 #sideleft { float:left; width: 219px; }
.xspace-layout1.mainarea-side { margin-left: 27%; }
/*Layout_2 左侧导航*/
.xspace-layout2 #sideright { float: right; width: 219px; }
.xspace-layout2.mainarea-side { float: left;}
/*Layout_3 左侧导航*/
.xspace-layout3 #sideleft { float:left; width:219px; }
.xspace-layout3#sideright { float:right; width: 219px; margin-top:16px;}
.xspace-layout3.mainarea-side { float: left; width: 450px; }
.xspace-layout3.mainarea-side-single { margin-left: 27%; }
.xspace-layout3#xspace-guide {}

/********边栏定义*********/
#sideleft{text-align:left;}
#sideright{text-align:left;}
#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: no-repeat lefttop;padding-left:39px!important;padding-top:4px;color:#000000;font-size:14px;height:38px;}

/********目录的隔离线*********/
#mainarea.xspace-blocktitle{
background:no-repeatleft 7px;
color:#000;
font-size:14px;
padding-left:39px!important;
padding-top:20px;
height:35px;
}
#mainarea.xspace-title{background: no-repeat left 7px;color:#000;font-size:14px;padding-left:39px!important;
padding-top:20px;
height:35px;}
#mainarea.xspace-entrytitle{color:#000;font-size:13px}
#announcement,#show{margin-top:20px}
.xspace-smalltxt{color:#8a8a8a}
.xspace-logo{background:none!important;}#xspace-goodsbaseinfoli { border-bottom: none!important;}
#xspace-ownerinfo{border: none; }
#xspace-ratesa { float: left; background: #EEE; color: #8a8a8a; opacity: 0.6; filter:alpha(opacity=60); }
.xspace-logo{background:none!important;}
/*项目列表*/
.xspace-itemlist {margin:0;}
.xspace-itemlistli { border-bottom: 1px solid #8a8a8a!important; }
/*信息正文中的模块*/
.xspace-msgmodule h5 {  border-bottom: 1px solid #8a8a8a; }
/*自定义字段*/
.xspace-addoninfo { border: 1px solid #8a8a8a}
/*出价记录*/
#xspace-aplist th, #xspace-aplist td { border-bottom: 1px solid #8a8a8a }
#xspace-aplist.xspace-darkrow { background: #ccc; }
#xspace-aplist.xspace-ontop td { background: #ddd; }
#xspace-ownerinfo{ border: 1px solid #8a8a8a;}
/*商品基本信息*/
#xspace-goodsbaseinfo li {  border-bottom: 1px solid #8a8a8a  }
/*图片显示页面*/
.xspace-imagebox { border: 1px solid #8a8a8a  }
.xspace-multipage{margin-top:6px; clear:both;}
#xspace-imgnavbar{  border-bottom: 1px solid #8a8a8a   }
/*文件显示页面*/
#xspace-filebaseinfo li { border-bottom: 1px solid #8a8a8a   }


/*信息正文中的模块*/
.xspace-msgmodule h5 { border-bottom: 1px solid #8a8a8a  }
/*Tab选项卡*/
.xspace-listtab a { background: #EEE; color:# 8a8a8a  }
.xspace-listtabli.xspace-active a { color:# 8a8a8a ; font-size:12px}
/* 煦珜 */
table.xspace-pagea { color: #8a8a8a ;}



/********页面底部定义*********/


#xspace-footer{background:no-repeatcenter top;color:# 8a8a8a ;height:160px;margin:0px auto;padding-top:80px;text-align:center;width:996px}
.xspace-itemlinksa, .xspace-itemlinks em { padding-right:0.4em; margin-right: 0.2em;border-right: 1px solid #8a8a8a ; font-style. normal; }

= = = = = = = = = = = = = = = = = == = = = = = = = = = = = = = = = = = = = = = = =


Source : ※拉比の部屋☆

乔思琳

很实用！我的部落客现在换新装罗~~~~
谢谢你的教学！

绿草仙子

現在好像不能進入編輯我的风格主题，是不是？