22 123
发新话题
打印

[教程] 在TOPZJ模板基础上制作有框架的立体风格[图示]

本主题被作者加入到个人文集中

在TOPZJ模板基础上制作有框架的立体风格[图示]

很多朋友问到,在这里就简单的说下——

效果预览:



这个看起来好像很复杂,由于TOPZJ只有一个默认模板,我只是定位了一下LOGO和BG的位置,让它看上去有立体感而已~~

制作步骤:


一、首先你要确定论坛主表格的宽度,填写界面方案,我这里定义的外表格宽度90%,主表格宽度90%,注意LOGO和背景项为空,提交返回首页,效果step1:



二、PrintScreen截屏,打开Photoshop新建1024*768画布,Ctrl+V粘贴,新建辅助线定位,确定LOGO大小,如图step2:



三、再框选内框大小,高度自定。

注意:我喜欢把图做在框架上,喜欢把图做框架内的请把框架上移,居外描边3像素,效果step3:



四、选定LOGO裁切,得到LOGO的基本框架存档上传,实例step4:



五、填入风格界面方案的LOGO处,提交,返回首页预览,效果step5:



查看是否居中显示,左右边线与主表格距离是否对称,等等……修改直到最佳位置。

六、定位好LOGO再做背景就简单了,PrintScreen截屏,打开Photoshop新建1024*768画布,Ctrl+V粘贴,填充背景再框选主表格宽度描左右边,效果step6:



七、把背景截切成需要的大小,全宽的话1010像素就够了,高度不限,这里因为我设想的风格图比较复杂,填充效果不佳,所以我直接用的全屏大小1022*680,稍微偏大了点,实例step7:



八、上传背景到风格包里,填入界面方案中提交,返回首页查看与LOGO是否连接,与主表格距离是否恰当,等等……修改直到最佳位置,效果step8:



九、到这里为止,框架就做好了,或许大家会想为什么要做空白框架呢?

  做图的过程本身就是不断修改的过程,如果不先定位好,修改-存档-上传-刷新……都是很浪费时间的!

十、定位图做好以后,我们就可以直接在step4和step7的基础上设计图片了。完成效果step9:



思路如上,大家自己琢磨、多多动手,虽然很难,如果有心去做,还是可以做好的,期待大家有好的作品!!!

相关教程:

1、十分钟给论坛安个播放器,附:免费空间—http://bbs.topzj.com/thread-195219-1-1.html

2、没有FTP空间,用相册更换风格的方法——http://bbs.topzj.com/thread-173302-1-1.html

3、透明风格/窄风格,自己设计——http://bbs.topzj.com/thread-186716-1-4.html

4、中间显示Flash公告的三栏式排行榜——http://bbs.topzj.com/thread-213638-1-1.html

相关下载:

1、☜♥女生论坛专用♥☞DZ5.0.0淡蓝手绘风格

2、☜♥女生论坛专用♥☞DZ5.0.0雅绿水墨风格

3、☜♥TOP浙江专用♥☞DZ5.0.0黑色欧美风格

4、☜♥TOP浙江专用♥☞DZ5.0.0亮紫朋克风格

5、☜♥TOP浙江专用♥☞DZ5.0.0淡黄烟花祭风格

6、☜♥TOP浙江专用♥☞DZ5.0.0忽尔今夏风格

7、☜♥TOP浙江专用♥☞DZ5.0.0萍踪侠影风格

喜欢的亲们,请帮忙顶贴,有问题请跟贴!

谢谢TOPZJ提供我们这么好的免费平台!


[ 本帖最后由 issey 于 2007-4-18 20:07 编辑 ]
附件: 您所在的用户组无法下载或查看附件
本帖最近评分记录
  • adicom 金币 +5 原创内容 2007-4-16 19:55

TOP

能不能说得详细点 ~我菜鸟啊~
零壹社区
http://ccgl.cc.topzj.com/index.php
杭州七中校论坛

TOP

做的很漂亮

TOP

汗……这个要怎么详细?做图是需要点想像力的!

你要先在脑子里设想下你要达到的效果,再循着大体思路去做,过程中还要不断的修改,直到完美达成预期效果……

总之,有些东西看起来简单,可能要花几个小时,几天或者几年去学会掌握它,就好像达·芬奇画鸡蛋一样~~

再怎么教,如果你试都不去试,怎么能懂呢?

TOP

看的一头雾水。。。楼主能否配图教程么。。
http://sisuitaliano05.ent.topzj.com

TOP

增加了图示,累死我了,大家自己看吧,看过记得回贴~~

TOP

顶一下,好,,收下了————,

TOP

555,LZ,你会不会把内个伤城的代码整理出来呢?好期待!!

HOHO,俺很喜欢LZ哒风格哒

TOP

还有问题我不是很懂。。就是BG不是都平铺的?为啥这个风格的背景就是一个框呢?好想学ING。。

TOP

不错啊```很PP``这几款偶都很喜欢的````

TOP

 22 123
发新话题