栅格:从混乱到秩序
作者：snlchina 来源：蓝色理想 发布时间：2008-07-02 12:09:00
栅格就是你对页面版式的规划
你日常所见的许多页面都有栅格存在。你可能注意不到，但它确实存在，并且支撑着设计内容，建立整体的架构，引导着页面的元素。
栅格是隐形的架构，用于指导你页面上各种元素的放置。栅格不会在印刷成品上出现，但却影响巨大，它控制着文本栏的宽度、照片周围空白的一致、杂志上每页重复出现元素的固定位置。栅格是一系列的辅助线，决定着印刷品的边距，页面元素（大标题、正文、照片等）之间的间距，让你知道如何在空白的页面上放置它们。
在决定是否使用或怎样使用栅格之前，你应该了解栅格的一些基础知识以及创建方法。虽然在印刷成品中看不到栅格，但在构建页面的过程中你还是需要能看见它。
在你的页面版式中可能会设置有“Margin”（页边距）。在屏幕上这些边线可能会显示为浅色的实线或虚线。上、下、左、右的边线在你的页面中部形成了一个盒子。你将以此为基点，建立单元格。通过把页面均分为几个等份，来创建多个单元格。你可以创建可见的网格来辅助页面排版：你的页面排版软件有辅助线的功能，或者你可以在非打印层绘制边线或方块。通常你可以从页面旁的标尺上“拖拽”出一条辅助线，然后放置在需要的地方。
栅格与边距
边距决定页面的外部边界。它们象一个画框一样包围着你的页面内容。四周边距不一定是均等的，但在（同一个出版物内）每一页之间或每一版之间边距通常是保持一致的。在大部分程序中，你在设置页面格式（尺寸规格）的时候就可以设置页边距。在某些程序中，你甚至可以“实时的”在屏幕上拖动边线来调整边距。栅格与栏空
当你将页面的内部空间（版心）分割为几个均等部分后，每个单元之间的白空间就称为"Alley" （栏空）。栏空的方向是水平的、垂直的、或是两个方向兼有，取决于你的栅格设置。在某些设计软件中，也称之为白空间或文本栏的"gutter"（内边距）。栅格与内边距
两页或两版展开时，内部的边距就称为"gutter"（内边距），即中缝两边的边距。在某些排版软件中，两个文本栏之间的间隙也叫做"gutter"。栅格单元
栅格单元是你在页面上放置文本和图片的基本坐标。它决定的是“放置”而非“尺寸”。就是说，假如你有一幅比栅格单元大的图片，你一样可以使用它。你可以用栅格单元来帮助你缩放图片尺寸，缩放匹配1、2、3或更多个栅格单元大小，然后将它放置在页面上。栅格提供了视觉上的条理性
栅格有着不同的应用，但并非适用于任何设计、任何人。杂志和简报之类的出版物几乎都离不开栅格。栅格增添了页面之间的一种连贯性，并且大大加速了设计的进程，设计师不需要每一页都“从草图开始”规划版式和设计。
在一系列独立而有关联的印刷品（如系列海报，或是为某个广告活动或某产品线设计的一系列传单）中，一个共同的栅格有助于统一这系列独立印刷品的整体形象。
在一件印刷品中往往有多个独立元素（本文块、大标题，照片，图表），栅格会帮助你把这些页面元素组织得井井有条。
英文原文：http://desktoppub.about.com/od/grids/l/aa_gridsorder.htm
0
投稿猜你喜欢
- 命名一直是个让我头痛的问题，特别是那些看上去差不多的模块，所以就得想办法啦，我总结了下面的方法，虽然还在试验中。希望对大家有帮助。欢迎大家提
- 原文地址：30 Days of Mootools 1.2 Tutorials - Day 19 - TooltipsMootools 1.2
- 今天在工作中遇到了一个问题，需要按时间查询，可是查询出来的结果显示的不正确。举个例子来说，要查找出2007-10-12至2007-10-31
- domainname.asp<form method="POST"> &nb
- 第四篇《WEB标准能有多难？》专栏文章将结束关于文本部分的XHTML的讲解。那么这篇主讲的内容涉及链接、标题、插入、删除、上下标、分割线、换
WAP站点，这似乎是一个有点落伍的东西。在诞生之初，它很简陋，只能通过一个叫WML的标记语言来搭建没有任何美感的文字+链接页面。而今，绝大部- 在使用Dreamweaver制作主页的时候往往需要改变表格的高度。然而有时当我们拖动表格的边框，无论怎样拖动，等到放下鼠标，表格却又恢复到原
- 1.怎么样查看数据库字符集 [A]数据库服务器字符集select * from nls_database_parameters，其来源于pr
- 如果用户查询时，使用Order BY排序语句指定按员工编号来排序，那么排序后产生的所有记录就是临时数据。对于这些临时数据，Oracle数据库
- 有感于中国互联网设计界十几年的变化，从网页设计师变身界面设计师，和近一两年来兴起的转型交互设计师。大多数都是随着一个行业的兴起而前赴后继的投
- 1、用户有三种：活跃用户、沉睡用户、外部用户。2、据不完全统计，外部用户8亿，沉睡用户1.2亿，活跃用户1千万。3、就算不去管活跃用户，或者
- 1、灵活运用样式 熟悉网页设计的网友就知道，调用Style的方法很多，我们可以单击鼠标右键选择Custon Style来调用Style标准，
- JavaScript组件打包模式js组件通常带着css image ，但这样使用起来可能会有些小麻烦，为了让组件足够的solo，有了把css
- 在学习与运用ASP中，response对象涉及到的方面也比较多，想全部都掌握也并非一两天的事，我也是最近才发现response对象中居然有这
- 在网上游荡，看着别人的精彩主页难免心里痒痒的，但自己精心布置的家（个人主页），如果在不同的浏览器中呈现
- CSS命名规范一．文件命名规范全局样式：global.css；框架布局：layout.css；字体样式：font.css；链接样式：link
- class test { &nbs
- 本文中介绍了一个MySQL的存储过程，其中涉及Cursor的使用，示例如下：CREATE PROCEDURE `justifyGroupNu
- HTML 5基本思维概念形成于2003年，之后W3C对页面超文本应用技术工作小组（WHATWG）开发的HTML草图颇感兴趣，这个小组的开发人
- 前两天有一位网友问我一个关于Javascript中++操作符的问题，他的代码大致是这样的ADS.addEvent(window,'c
