YUI中的css——Grids.css

1，grids.css中页面布局的宽度用的是em宽度，是因为em会随着用户调整字体的大小(查看-文字大小)而改变宽度，从而有更好的用户体验；

2，根据reset.css，页面字体大小为13px，所以页面宽度也要根据13px来设置em，但是，在ie中有点问题，如果在firefox等标准浏览器中字1em为13px的话，在ie中要13.3333px，而且用*过滤器来设置ie中的em宽度。如在body字体大小为13px的情况下设置页面宽度为600px，在ie中为45.00em，而在firefox等标准浏览器中为46.15em。

3，注意(来自http://developer.yahoo.com/yui/grids/)

Note:

   Here are some other things to keep in mind: 1) The width is set in ems because ems scale with user-initiated font-size adjustment, and therefore provide a superior user experience. 2) YUI Fonts does a good job of normalizing the width of an em, but we're still obliged to provide a slightly different value for IE. 3) Be sure the width value for IE comes after the value for everybody else. 4) Setting the min-width is optional, but helps the grid maintain integrity as the viewport shrinks. 5) The text-align and margin are used to help center the page, and should not be modified.

4，

模板类	预设描述
.yui-t1	左边160px的边栏
.yui-t2	左边180px的边栏
.yui-t3	左边300px的边栏
.yui-t4	右边180px的边栏
.yui-t5	右边240px的边栏
.yui-t6	右边300px的边栏

5，

特殊的内部类	预设描述
.yui-gb	1/3 - 1/3 - 1/3
.yui-gc	2/3 - 1/3
.yui-gd	1/3 - 2/3
.yui-ge	3/4 - 1/4
.yui-gf	1/4 - 3/4

转载于:https://www.cnblogs.com/muguaworld/archive/2008/06/15/1222746.html