如何创建模板

发布网友

我来回答

1个回答

热心网友

建自己的百度空间模版 自己动手2007年02月27日 星期二 18:44首先非常感谢“i Lavie”的“极简模式”模版提供的帮助。

看到百度上有很多的空间设计模版,但是没有我最喜欢的。
我不喜欢花里胡哨的图案
我也不喜欢人物背景
我不喜欢深色的主题
也不希望自己的空间太绚丽
我也不喜欢鼠标变来变去
找来找去,我还是没有找到合意的模版,因此我决定自己试试。

感谢下面的资料对我提供的帮助:
1. 百度对于CSS的详细说明,其中颜色选择器是会用到的
2. 天涯何处写的关于如何得到他人的模版空间代码

我没有学过编程,不需要有编程的基础。

因为有既成的模版,我要做的三件事就是:
极简白模版的主题是蓝色的,抬头的图片是蓝色,链接显示字体也是蓝色。
1. 将抬头的图片改为我自己设计的;
2. 将链接显示字体该为绿色,成就我的绿色主题;
3. 原来的模版框架太小,我希望将整个框架宽度提高。

第一步换抬头图片

Photoshop是我的强项,因此这对于我来说很容易。
先将原模版上的图片另存到本地,然后用Photoshop进行编辑就可以了,这样主要是为了保证图片的宽度能和空间的框架相统一。
做好图片后,将图片放到自己的空间上,我的图片就放到上面了,因为空间只接受网络路径上的图片,将原来的图片替换:
/*头部*/
#header
也就是上面url后面的路径。

第二步更改字体颜色

将链接语言上的颜色由蓝色变为绿色,只改变了二种颜色,第一是显示颜色由天蓝变为绿色,第二是鼠标放上去后的文字悬浮颜色,将深蓝变为深绿。
找到颜色,例如#226DDD天蓝为显示的链接字体颜色,#445F88深蓝为链接字体颜色的悬浮颜色,将这二种颜色替换为你喜欢的颜色就可以了。
也就是下面的文字的显示颜色。
阅读全文>>
类别:心如明镜 | 编辑 | 删除 | 评论(2) | 浏览(11 )
如果你想将文章的颜色改变,则去寻找#000,将其进行更改。

第三步更改网页框架的宽度

用查找的方式将所有的width:750px替换为:width:913px
框架变大了。不过框架应该和头部的图片宽度是对应的,如果你的头部图片宽度更改了,相应要对网页结构的框架进行调整,变大变小直到头部图像和网页结构能否效果统一。

一些小技巧:

1. 如果你想更改头部文字的字体以及离边框的距离可以找到#header进行更改

/*头部*/
#header
/*URL链接的图片为头部的背景图片*/
#header div.lc{}
#header div.rc{}
#header div.tit
/*你的博客的名称,即为我的博客名“写在牛皮纸上的青葱岁月”,top为离顶部的距离,left为离左边框的距离,line-height为行距,行距一定要大于font-size,否则显示不全,font-size为字体大小,font-family为字体,这里CSS好像支持很多字体,我试过微软自带的一些字体,例如宋体、黑体等等,而且也试过方正字体,例如方正准圆简体等等,都支持,所以你可以任意的去输入你希望显示出来的字体*/
#header div.tit a.titlink
/*这里的color即为你的博客名称,例如我的“写在牛皮纸上的青葱岁月”的字体颜色*/
#header div.tit a.titlink:visited
#header div.desc
/*空间简介字体颜色距离的设置,例如我的“质朴 坚韧 朴实”,top为离顶部的距离,right为离右边框的距离,字体颜色,行距,字体大小,字体,这些你和博客名称一样,你都可以任意设置的*/

2. 如果你想更改导航区域的设置,可以找到#tabline进行设置

#tabline
#tab
/*主页、博客、相册……离上边框的距离,背景(这里没有设置),离左边框的距离*/
#tab a.on,#tab a.on:link,#tab a.on:visited
#tab a.on:hover
#tab span
#tab a:link
#tab a:visited
#tab a:hover
/*这里面也有字体以及悬浮字体的颜色、大小的设置,都是大同小异,可以去更改你喜欢的效果*/

3. 如何更改“最近访客”的显示效果?

我本人是不太喜欢默认的“最近访客”的显示效果的
一是:每人用的图片和颜色大小都不一致,放在博客里太花哨;
二是:默认的字体、颜色也不是我喜欢的。
不过欣慰的是我找到了一段可以更改其显示效果的代码,并进行了更改,之前的代码太过复杂,而且很多效果我并想要,所以我简单的进行了一些修改:
/*最近访客-给图片加边框加滤镜*/
#mod_track .modbox table td img
/*这里是对“最近访客”的图片进行强制*,无论之前你的图片的长宽比是多少,强制*显示为:45px*45px,也就是width和height后面的显示值,当然这个大小你也可以更改为你喜欢的大小。border为图片的边框颜色和边框的宽度,我设置为2px,边框样式我选择为实线solid,如果你不喜欢可以设置为虚线dashed*/
#mod_track .modbox table td a img
/*这里对“最近访客”图片进行了静态滤镜效果,默认显示为灰度,透明值opacity我设置为了25,可以从0~100人任意更改,Gray是灰度滤镜效果,还有二种可以选择,invert和Xray*/
#mod_track .modbox table td a:hover img
/*这里对“最近访客”图片的悬浮效果进行了设置,也就是将鼠标移动上去时的滤镜效果*/
#mod_track .modbox table td a
/*“最近访客”的用户名文字样式,你可以更改其显示颜色和字体以及是否加下划线,以及字体是否加粗font-weight:bold为字体加粗*/

------终于-------
终于我有了一个全新的空间!效果:
百度空间/modify/preview/868cbdc322d22f55b219a8fa.css
“模版>风景>绿色的梦”

------附注 更新于2007.3.1日-------
将模版的左边距进行了修改,以前的左边距太大,主要是为了适应我家的19寸液晶显示器。
现在我已将左边距缩小了
效果:
百度空间/modify/preview/96ab82ef9ade81efce1b3eb7.css
“模版>风景>绿色的梦V2.0”

------附注 更新于2007.3.4日-------
更新了标题栏的背景,更加美观。
百度空间/modify/preview/a4d7350c7fc11191ef3939.css
“模版>风景>绿色的梦V4.0”

声明声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:11247931@qq.com