YUI Grids CSS 解读
作者：blank 来源：蓝色理想 发布时间：2008-05-28 12:49:00
标签：css,grids,性能,浏览器
YUI 中的 Grids CSS 主要有三个部分值得大家关注和学习：
1、布局的思想：使用 “负 margin（Negative Margins）” 技术
详细可参阅：《Creating Liquid Layouts with Negative Margins》
2、使用 em ：当用户改变字体大小时，宽度同时改变。
技巧：用 13 像素来平分宽度（保留小数到千分位），而 IE 浏览器用 13.333 。
/* 750 centered, and backward compatibility */
#doc {
width:57.69em;
*width:56.251em;
min-width:750px;
}
57.69 = 750 / 13
56.251 = 750 / 13.333
注：《Setting Page Width with YUI Grids》 一文中提到：IE 下的 em 是宽度除以 13 ，再乘以 .9759 得到。同解于为什么现在的 YUI 源码中 IE 下 750px 的宽度是：56.301em（750 / 13 * 0.9759）。
此算法将在 YUI 的下个版本中换为上面的新算法（IE 浏览器用 13.333 ）。
3、清除布局的浮动
针对非 IE 浏览器：
.yui-gf:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
而对于 IE 浏览器，使用了 zoom:1 来触发 haslayout。不过对于此 Nate Koechley 这样解释的：
Zoom is a non-valid attribute and so you’ll see warnings when you validate your CSS. I’m aware of that and think it is an acceptable tradeoff.
个人比较赞成他的想法：I think it is an acceptable tradeoff。
0
投稿猜你喜欢
- 1.因为oracle 10g暂时没有与win7兼容的版本，我们可以通过对安装软件中某些文件的修改达到安装的目地。 a)打开“\ORACLE1
- MySQL支持的两种主要表存储格式MyISAM，InnoDB，上个月做个项目时，先使用了InnoDB，结果速度特别慢，1秒钟只能插入10几条
- 如果你能很好的理解我下面的一句话，那这些都不是问题了。asp是服务器端语言，它的作用是动态生成客户端浏览器所能识别的html css jav
- 分析当前用户下所有表的记录总数保证好用！begin dbms_utility.analyze_schema(user,'COMPUT
- SQL Server服务器的配置选项属于那种人们了解较少且经常误用的选项。当一个技术支持人员要求你按照某种方式调整一个选项、而另一个技术支持
英语原文地址：点此浏览新年开始了，来点猛料，放上15个漂亮的网页排版的demo，来欣赏一下。去年我也专门找了15个同类网站，比较受用户欢迎，- 今天写了一段CSS,写时突然想到的,写出来和大家分享一下; 我们可能早已习惯了padding在不同浏览器中的不同之处,
- 这种情况在Access下可以通过,但SQL则不行,在百度搜索解决方法,发现N多人出现同样问题却找不到解决办法: 代码如下:set
- ACCESS数据库中Field对象的caption属性（也就是标题）是用来设置数据字段的标题，在正常的数据库设计中为了保持维护的便利性，许多
- 关于CSS中的命名规则（其实我觉得是XHTML元素的命名规则更加合理些）这个问题，已经有很多人在说了，其中也不乏一些真知灼见。不过这种东西也
- 阅读上一篇文章《WEB2.0网页制作标准教程（5）head区的其他设置》在开始正式内容制作之前，我们必须先了解一下web标准有关代码的规范。
- Function closeUBB(strContent) '*************************
- Memoization 是一种将函数返回值缓存起来的方法，在 Lisp, Ruby, Perl, Python 等语言中使用非常广泛。随着
- 在JAVASCRIPT中LEFT函数的等价函数：function left(mainStr,lngLen) {if&nb
- 给浏览器绑定事件有时候是非常痛苦的事情，不同的浏览器提供不尽相同的功能的同时，也提供了不同的事件。例如，IE 系列的浏览器支持 mousee
- 首先说明，伪造访问来路不是什么光明正大的事情，目的就是为了欺骗服务器。原本以为给 XMLHTTP 对象增加一个 Referer 的heade
- Dreamweaver MX 2004 试用试用心得：安装：选择工作界面(我选了默认的设计模式)初次启动，选择30天试用如果你也看到这个警告
- 前两天看见有人问静态网页加密问题，就写了这个代码稍微有些长，解释一下思路：加密时：先把用户的密钥A用md5加密为B,然后用B异或源文件S0得
- 译者按：我们时常能看到不同JavaScript库/框架之间的各种比较，但这次 YUI3 架构师和 jQuery 之父的直接对话却非常难得，也
- <％ dim conn,mdbfile mdbfile=server.mappath("数据库名称.mdb") s
