博客空间网页模板背景制作方法
在决定制作博客空间网页模板背景的时候,首先要确保的是自己的博客空间是可以自己修改,设计或制作模板的,如Blogbus,Blogcn,本文以Blogbus为例介绍修改传统模板,也就是旧模板系统5种方法。如果有什么问题,请务必也留下你的回访地址喔~! 新的模板系统我没有研究过,不太清楚怎么改。
首先请看〖修改模板前必须先……〗
1。颜色背景![]()
![]()
以某种颜色为背景是最简单、常用的方法,在显示速度上占绝对优势。方法是在自定义模板的CSS里的“body {”下写
background-color: #6位数颜色代码;
注意(英文输入法的)分号不要掉啦。颜色代码是什么呢?看这里吧:颜色代码或者 调色板
这种方法虽然简单,但是在色彩的选择和整体搭配上要做到协调美观就不是那么容易的事咯~选的不好,或者搭配不好就会很恶心的。
2。砂纹背景(图片的重复)![]()
![]()
沙纹背景属于图片背景的范畴,它的主要特点是整个页面的背景可以看作是局部背景的反复重排,也就是同一张图片在水平和竖直方向上的反复排列,在这类背景中以沙纹状的背景是为常见,所以统称为沙纹背景。
找一张小的图片,要注意的是当其反复排列成一个背景时要能成为一个整体。方法是在自定义模板的CSS里的“body {”下写
background-image: url(http://开头的图片的网址);
background-repeat:repeat;
注意(英文输入法的)分号不要掉啦。
如果是黑色的背景图片,特别是星空背景,建议在CSS里的“body {”下按第一种颜色背景的方法再加上“ background-color: #000000;”,颜色代码是6个零,即黑色。这里有一些模版背景的图片素材:黑色星空背景模版图片-黑夜和彩色背景模版、图片
3。条状背景(图片的重复)![]()
![]()
条状背景与沙纹背景比较相似,不同的是它只让图片在一个方向上重复排列。以在竖直方向上排列为例,方法是在自定义模板的CSS里的“body {”下写
background-image: url(http://开头的图片的网址);
background-position: top center;
background-repeat: repeat-y;
注意(英文输入法的)分号不要掉啦。图片的大小要选取适当,尽量选宽一点的。
![]()
4。整图背景![]()
这里所说的整图背景是指只用一整张大的图片作为背景,在拉动浏览器窗口的滚动条时,图片仍然位于页面的正中间而不随页面内容一起滚动。方法是在自定义模板的CSS里的“body {”下写
background-image: url(http://开头的图片的网址);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:50% 50%;
如果你觉得照片位于页面的正中间不满意,你也可以随意地调整它在页面中的位置,只需要调整"background-position"的值就可以了。
或者:background: url(http://开头的图片的网址) no-repeat top left fixed;
5。双重背景两层图![]()
双重背景的意思是和新浪的模板背景相似,模版最底层铺一个背景,在这层背景的上面,即日志模块和侧边栏上再铺一层背景盖住。如图
方法是在自定义模板的CSS里的“body {”下写:
background-image: url(http://开头的图片的网址);
background-repeat:repeat;
在“#container {”下写:
width: 800px;
border-left: 1px solid #6位数颜色代码;
border-right: 1px solid #6位数颜色代码;
margin: 0 auto;
background-image: url(http://开头的图片的网址);
background-repeat:repeat;
注意(英文输入法的)分号不要掉啦。其中“width: ”后面的800是上面一层背景的宽度,可以自己修改,一般container下已经给了这个宽度;“border-left:”“ border-right:”分别是上面一层背景左右两侧的竖条分隔线,将上、下两层背景分开,所以这个也可以不要。



╰εїз゚ Comments >>>
因为你用的是新模板系统喔!
(2008-05-06 14:35:47)
我用的是ATTITUDE CAMERA
我写的是修改旧模板的方法哦,新的模板我没有研究过,不太清楚怎么改,很头疼~~~~
(2008-05-05 11:26:04)
试了。真有用。
呵呵。细心有才气的女子。我喜欢。
Thank you!
(2008-04-15 19:37:50)
想请问一下,你的模板最上面的那图片地址是什么,很喜欢。谢谢!
。我想弄成像我新浪那種效果http://blog.sina.com.cn/yaozaizai
。但試了幾款模板都沒找到該改哪.
。覺得親這款模板的背景好看.但不知道最頂上那圖片該在哪改.
。找了狠久沒找到.要抓狂喇..$_$
。親可以幫我看看我要的效果應該選哪款模板還有該改哪不..
。謝謝噠..無限感激德TAT
話說在大巴裏很少有滿意德模板~
。親能告知些許技巧不~
先謝過噠~=_=++
技巧就是一点一点地改。。。。。。呵呵
(2008-03-05 23:35:17)
我想问一下你这个博的背景,就是白色底上面有淡灰色暗花纹的这个背景是怎么弄的?我也想改成这样,不知道怎么找图片呢-.- 还请赐教啊!!!:>
我也想弄一个类似的。可以在那个页面显示出留言板的
还有。就是我的博的日志评论那里左边对不齐该怎么弄
留言板在BUS论坛里有人教了个比较简单的做法,你可以看看。日志评论那里是那样的,因为标点符号和字所占的空间大小不一样,只能左对齐,没办法两端对齐的。
(2007-11-25 11:24:29)
这个要进入旧模板里.
(2007-11-14 21:38:01)
原因很多,缓冲慢了,网速慢了,代码不对,地址不对,文件有防盗链,地址已经删除等……
(2007-11-03 23:31:25)
谢谢指教~
你的博客很可爱啊!这个原因有好几个,最常见的就是图片地址不对,或者有防盗链,你图片是上传到自己的BUS了吗?
(2007-10-23 12:20:26)
我怎么找不到呢`
方法是在自定义模板的CSS里的“body {”下写:
background-image: url(http://开头的图片的网址);
background-repeat:repeat;
在“#container {”下写:
width: 800px;
margin: 0 auto;
background-image: url(http://开头的图片的网址);
background-repeat:repeat;
.........................................
结果出来的效果只有窄窄的1条黑色 背景.
似乎需要3层背景???
麻烦你再帮我看看吧.....
谢谢!!
你选的这个模板如果要保留原来的日志模块的样式,就很难做双层的,因为你的每篇日志的模块已经有背景图片了。
(2007-09-13 14:00:14)
我11号才开的BLOG,对程序完全不懂,想不到遇到你这样的好心高人,你的BLOG很棒,几乎含盖摸板所有的教程方法,而且讲的非常细致入微,连我个对程序一窍不通的外行都学的带劲十足,佩服你尽心尽责的做事态度.希望与你交个朋友!!!
你的BLOG也很漂亮呢!!!
谢谢啦!!快乐!
很聪明喔~!
(2007-09-13 13:58:38)
我在我模板里怎么改也做不了第四个整图背景。是不是我模板不对啊???
我在我模板里改半天,怎么也不能做到第四点整图背景
是不是我的模板有问题啊?
这个是BUS系统里的蔷薇模板。
(2007-08-28 11:59:56)
我想以这个模版为底自己改变他的顶图和色调,可是看了ccs就该不来。。。。。。能帮帮看看应该改哪些部分呢?
我在photoshop 那里做了几张,可是出来的效果不行,
怎么会这样?
我应该有什么软件,还有怎么做?
。。。。。我不会作图,PS我只会一丁点
(2007-08-24 20:15:57)
我的意思是说怎么可以做成那个网站的效果~~
并不是要弄那个网站~~
谢谢~~
评论分页:共3页 1 2 3 下一页 最后一页