photoshop制作960 Grid System的网页模板(9)插图

photoshop制作960 Grid System的网页模板(9)

先看最终效果图 网格设计呢,通常显得很整齐规范,有时看上去也比较专业。但网格设计相对来说也是比较复杂的,往往需要精准的测量和栏目划分。960 Grid System/960网格系统,这是一套可以让你快速创建网格设计的工

photoshop制作960 Grid System的网页模板(2)插图

photoshop制作960 Grid System的网页模板(2)

删除中间的黑色图层。 删除黑色图层 接下来把中间的十等份全部删除吧。当然,你可以隐藏中间的十等份,下面的操作可以参考这十等份来调节位置。 隐藏中间的部分 添加一条竖立的虚线,在网页制作的时候,这条虚线可

广告位
photoshop制作960 Grid System的网页模板(8)插图

photoshop制作960 Grid System的网页模板(8)

加上其他文字,我们自己做960 Grid System就完成了! 添加其它文字,完成 本实例其实制作起来非常简单,主要是根据960 Grid System的布局,把握好每一个元素的定位

photoshop制作960 Grid System的网页模板(7)插图

photoshop制作960 Grid System的网页模板(7)

初步效果photoshop教程

photoshop制作960 Grid System的网页模板(6)插图

photoshop制作960 Grid System的网页模板(6)

右侧添加75*75像素的图片 添加小图 我们再给这些图片加上一个像素天蓝色边框,在网页切割时候我们可以直接写CSS就可以了。 添加图片边框

photoshop制作960 Grid System的网页模板(5)插图

photoshop制作960 Grid System的网页模板(5)

好下面我们来对应一下十等份的位置! 用基线确定位置 底色并复制 复制图层

photoshop制作960 Grid System的网页模板(4)插图

photoshop制作960 Grid System的网页模板(4)

插入头图、文字 头图和文字 添加文字口号 栏目内容

photoshop制作960 Grid System的网页模板(3)插图

photoshop制作960 Grid System的网页模板(3)

为了使读者知道在第几页,我们把当前标签换一个颜色。 更换当前标签颜色 添加RSS阅读标签的图片。 RSS阅读的标识

photoshop制作960 Grid System的网页模板插图

photoshop制作960 Grid System的网页模板

先看最终效果图 网格设计呢,通常显得很整齐规范,有时看上去也比较专业。但网格设计相对来说也是比较复杂的,往往需要精准的测量和栏目划分。960 Grid System/960网格系统,这是一套可以让你快速创建网格设计的工具,之所以叫960,就是说模板的宽度是960像素。而之所以用96