注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

小鸟娱乐天堂

http://qq2502979339.blog.163.com

 
 
 

日志

 
 

【转载】设计制作博客模块背景边框图例详解  

2014-03-06 08:35:18|  分类: 小鸟空间素材 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

海边美女风景日志背景边框 - 山间溪流 -     山间溪流的休闲屋 

 

博客制作教程

设计制作博客模块背景边框图例详解

编写:山间溪流

 

  网易博客的“风格自定义工具”是一款功能强大的博客模板设计工具,通过这个工具几乎可以制作出90%以上的现有网易官方主题风格。除了可以设置制作更换顶栏图片、导航、中区、底区、页面背景和浏览器背景外,还可以精心雕琢风格各个细节, 如:博客标题文字大小位置、按钮、导航当前项和鼠标滑过项、以及模块花边等等……

  设计制作模块背景边框(或称模块花边)是精心雕琢风格的很重要的内容,好的模块背景边框可以给博客增光添彩,大大提高博客的艺术性和观赏性。为了帮助一些新手朋友更好理解和应用本教程的内容,现在我们首先介绍一下有关模块的知识。

  我想重点说两个问题:

  1:在点击“风格自定义工具”上的“模块”后,操作界面上很醒目的出现了“九个区”,这九个区是什么意思呢?它的意思就是说:一个模块是由九个部分组成的。如果你要用“自定义工具”制作模块的背景边框图,你首先就要把设计好的模块背景边框图分割成九部分,这就是素材的准备,要制作好九个小区的背景图片素材。然后,再按照顺序一个一个上传到模块区域内,最后才能组成一个完整的模块背景边框。本教程就是按照这个意思和思路进行操作的。

  2:在博客上,虽然各个模块的背景边框都是相同的,但由于的位置和内容的不同,模块显示出的大小又不尽相同,这就是说,模块的尺寸大小是可以自动变化的。这种变化是依靠“2、5、8小区”的自由变化实现的。所以在选择“平铺方式”时,与其他小区是不同的,你在阅读下面的内容时稍加注意就能发现。

  下边我以设计制作圆角四边形模块背景边框为例,介绍一下利用“风格自定义工具”设设计制作模块背景边框的方法步骤。

  第一步:在现有博客中区的背景上(可以把背景用截图工具截下来),利用图片处理软件制作出如下图所示的圆角四边形模块背景边框图。(如图1所示)

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

第二步: 对上图进行剪裁,剪裁后如下图所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋
 
 

第三步:将图2分割成9部分,如图3所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋
图3:将背景边框图进行分割
 
第四步:点击“换风格”→ “自定义风格”→ “修改”,进入博客“风格自定义工具”操作页面,  点击上方导航栏中的“模块”→ “背景”→ “1区”→ “选图”,从电脑中选取“1区”的图片,载入图片后,“平铺方式”选择“不平铺”,并设置调整该区的尺寸,操作设置与效果如图4所示:

 

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

 图4:载入并设置1区图片的过程和效果图

第五步:点击“2区”→ “选图”,从电脑中选取“2区”的图片,载入图片后,“平铺方式”选择“水平平铺”,并设置调整该区的尺寸,操作设置与效果如图5所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

  图5:载入并设置2区图片的过程和效果图

 

第六步:点击“3区”→ “选图”,从电脑中选取“3区”的图片,载入图片后,“平铺方式”选择“不平铺”,并设置调整该区的尺寸,操作设置与效果如图6所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

  图6:载入并设置3区图片的过程和效果图

 

第七步:点击“4区”→ “选图”,从电脑中选取“4区”的图片,载入图片后,“平铺方式”选择“垂直平铺”,并设置调整该区的尺寸,操作设置与效果如图7所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

   图7:载入并设置4区图片的过程和效果图

 

第八步:点击“5区”→ “选图”,从电脑中选取“5区”的图片,载入图片后,“平铺方式”选择“水平+垂直平铺”,并设置调整该区的尺寸,操作设置与效果如图8所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

   图八:载入并设置5区图片的过程和效果图

 

第九步:点击“6区”→ “选图”,从电脑中选取“6区”的图片,载入图片后,“平铺方式”选择“垂直平铺”,并设置调整该区的尺寸,操作设置与效果如图9所示

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

  图9:载入并设置6区图片的过程和效果图

 

第十步:点击“7区”→ “选图”,从电脑中选取“7区”的图片,载入图片后,“平铺方式”选择“不平铺”,并设置调整该区的尺寸,操作设置与效果如图10所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

  图10:载入并设置7区图片的过程和效果图

 

第十一步:点击“8区”→ “选图”,从电脑中选取“8区”的图片,载入图片后,“平铺方式”选择“水平平铺”,并设置调整该区的尺寸,操作设置与效果如图11所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

 图11:载入并设置8区图片的过程和效果图

 

第十二步:点击“9区”→ “选图”,从电脑中选取“9区”的图片,载入图片后,“平铺方式”选择“不平铺”,并设置调整该区的尺寸,操作设置与效果如图12所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

 图12:载入并设置9区图片的过程和效果图

 

第十二步:点击“模块”→ “文字”,设置模块标题文字、重要文字、次要文字、链接文字的颜色,并调整模块标题文字的位置。

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

 图13:设置模块文字的颜色和位置

 

第十四步:点击“模块”→ “边框”,在边框类型选项中选择“无边框”。去掉原来的边框线。

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

 图14:设置模块的边框:去掉原来的边框线

第十五步:模块背景边框最终的效果图如15图所示:

如何利用“自定义工具”设设计制作模块背景边框 - 山间溪流 -   山间溪流的休闲屋

 图15:模块背景边框最终的效果图

 

山间溪流日志《专版导航》  

原创文章专版

文学知识专版

中国散文专版

外国散文专版

古典文学专版

原创散文专版

原创诗歌专版

中国诗歌专版

外国诗歌专版

文学参考资料

音画艺术专版

配乐朗诵专版

音乐欣赏专版

图文艺术专版

摄影照片处理

养生保健专版

博客综合知识

博客素材专版

日志背景边框

博客代码专版

在线文学阅览 网络搜索技巧 网页制作资料 P.S.应用教程 动画制作教程

谈读书—培根(英) - 山间溪流 -      山间溪流的休闲屋

  评论这张
 
阅读(1)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017