使用Photoshop+960 Grid System模板进行网页设计
作者：暴风彬彬 来源：彬Go 发布时间：2009-02-28 13:44:00
标签：photoshop,960,grid,system,模板,设计
前几天彬Go和大家一起讨论了960 Grid System这个CSS网格系统框架的基本原理和使用方法。今天，暴风彬彬将教大家使用Photoshop结合960 Grid System模板来设计一个真正符合960网格系统的网页效果图。
网格设计呢，通常显得很整齐规范，有时看上去也比较专业。但网格设计相对来说也是比较复杂的，往往需要精准的测量和栏目划分。960 Grid System/960网格系统，这是一套可以让你快速创建网格设计的工具，之所以叫960，就是说模板的宽度是960像素。而之所以用960像素来做为标 准，是因为960像素宽具有高度的灵活性。今天我们就来教大家制作一个960 Grid System的网页模板。（960 Grid System官方网站：http://960.gs/）
960 Grid System的特性是将960像素的网页分为12列的布局和16列布局。12列布局将总宽分成12份，每份的宽度是60px，而16列的布局分成16份，每份的宽度是40px，每部分左右边距都是10px，从而每列产生20px的空隙。
最终效果图
0
投稿猜你喜欢
最终效果下面开始制作：1、打开Photoshop软件，我们这里使用的是CS版本。其他版本一样啦~~~打开准备好的素材图片，并将这个图片复制三- 在制作之前，需要对立体的透视有一定的了解。这样制作起来就比较方便。而且做出的效果就比较真实。教程虽然不难，不过还是要注意好细节及光感的处理。
- "可选颜色"是Adobe Photoshop中的一条关于色彩调整的命令。但与色阶，色彩平衡和色相饱和度相比，就没有那么直
- 效果图1效果图2 效果图3 教程1 教程2 教程3
- 在此网页设计教程，您将了解如何创建一个美丽，绿色，时尚的布局在Photoshop。您将了解到流行的设计技术，如建立一个三维带和具有专业外观的
- photoshop制作茶/咖啡/果汁效果最终效果图：1、新建400*400文档，白色背景。 按CTRL R打开标尺，横竖拉二条参考线，定出画
- 本教程的素材图为室内拍摄的照片，光效比较柔和，人物肤色的质感不是很好，背景也比较昏暗。调色的时候可以根据需要适当把人物及背景处理一下。颜色可
- 如何用Illustrator来制作色彩喷溅效果最终的效果下面这张图就是我们的跟随这次教程得到的最终结果。 Step 1创建一个新文
- 最终效果：1.新建一个600*150的文件，背景填充黑色。选择“圆角矩形工具”画一个同样填充黑色的圆角矩形，选择“添加图层样式—斜面浮雕—描
- 本教程的实物图构造比较复杂，不过基本的构成小元素都是用类似的方法做好的。只要掌握好基本的透视及高光和暗调的变现，就很容易做出来。原图1、新建
- Photoshop入门实例：为照片添加万道金光,达到改变意境的特殊效果。步骤 1、打开图像素材。步骤 2、创建新图层，并使用渐变工具填充画布
- 最终效果1、打开Photoshop并创建一个新文件。尺寸我用的1920×1200（像素），之后，选择背景层，打开它的混合选项，选渐变叠加，颜
- 本教程简单介绍人物照片的调色方法。人物照片调色可以按照个人喜好选定颜色，人物部分也需要根据主题色适当调整。需要注意好人物及细节部分的处理。原
- 这次教程将向大家介绍一款漂亮的图层样式，我们将用它制作一个密封徽章。第一步：先建立一个新文档，这里我使用400×150 （像素）的大小。再添
- 我们有创造性的拍摄，在这种情况下，就可以表现在几乎所有的东西。我们聚集了一个充满娱乐性的图像，将它在二次合成。将这些图像变得让人深刻。
- 本教程婚纱照片的调色方法。大致思路：先大致的调整下图片的色彩层次，可适当的加点素材修饰，然后用调色工具调色，色彩的效果可按自己的喜好调整，最
- 做圆角的方法很多，自己写了一个，贡献出来，供大家拍砖。我们先打开photoshop，打开一张图，作为我们要制作圆角图的。使用圆角矩形工具，首
- 本教程色调以淡淡的青色为主，调色幅度不大。不过效果却看上去非常清爽。作者调色的时候基本上都是用可以选颜色调色。这个调色工具比较好控制&
- 本交换层介绍一种图片放大技巧。这种技巧据说能够把数码相机图像增大到整个海报大小，而用肉眼几乎看不出图像质量的降低。是不是如此呢？大家不妨一起
- 这篇Photoshop教程主要介绍利用图层样式的设置等，来制作黑色时尚的web2.0风格的导航面板，希望大家喜欢！我们先来看看效果图：最终效
