背景篇~

大脸mui的教学又开始了.... hoho~ 请叫我老师! *^÷^* （得意的笑）
可是上次的教学没什么受到欢迎叻~
害我心有点受伤的说~
唉~ 这次教完就停课呗~ ::>_<:: 哭

这次教大家如何换背景图...
首先，先选好你要的图片... ==||| 废话!
再把图片upload到网上，然后copy图片的图片网址...
要获取图片网址可以把图片upload到photobucket

♥ 以下的步骤很重要!
♥ 以下是图片重复方法!
拿到图片网址后，就到布局的修改HTML里找以下段落...
body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

♥成品


然后在background:$bgcolor;那里修改成...
body {
background:$bgcolor URL(图片网址)repeat;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

♥以下的是图片不重复的法...
你只要在background:$bgcolor URL(图片网址)repeat
那里修改为
background:$bgcolor URL(图片网址)no-repeat
其实只是加多no-而已...
例如以下...

body {
background:$bgcolor URL(图片网址)no-repeat;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

♥成品


然后，由于图片没有固定在你想要地方...
所以就要靠你自己咯~
当你post上你的图片后，往往图片都会在角落...
这时你就在你刚刚的代码中加上background-position:x y;
♥ x=由左到右的距離，y=由上到下的距離，而50則是設定成中間的%率
♥ 由于每张图片都有不同的size,所以请自行修改你的 background-position:x y;

在background-position:x y;下面加background-attachment:fixed;
是防止图片移动，如果你想照片移动就不用加! 废话多到~~ ==||

例如
body {
background:$bgcolor url(圖片網址) no-repeat;
background-position:50% 0%;
background-attachment:fixed;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

♥成品


希望这次的博客教学能帮到大家...
留下你的脚印...
让大脸mui得意得意一下...*^÷^* 得意的笑


♥ 感谢eve的教学...