注册本站  论坛  繁體中文

电脑技巧
手机 | MP3 | MP4 | 显卡 | 主板 | 显示器 | 光存储 | 笔记本 | 网络设备 | 移动存储 | 数码相机
键鼠 | CPU | 音箱 | GPS | 电视 | 服务器 | 投影机 | 机箱电源 | 品牌电脑 | 办公打印 |
| 网站首页 | Cisco | Windows | Linux | Java | Dotnet | Oracle | 网页设计 | 平面设计 | 安全 | 软件应用 | 电脑维修 | 办公维修 |
您现在的位置: 电脑技巧 >> 网页设计 >> CSS >> 网页设计正文

YUI 中的 Grids CSS值得关注和学习的

文章来源:蓝色理想 blank 作者:佚名 更新时间:2008-5-25 4:11:00 【 】 【加入收藏

YUI 中的 Grids CSS 主要有三个部分值得大家关注和学习:

1、布局的思想:使用 “负 margin(Negative Margins)” 技术

详细可参阅:《Creating Liquid Layouts with Negative Margins》

2、使用 em :当用户改变字体大小时,宽度同时改变。

技巧:用 13 像素来平分宽度(保留小数到千分位),而 IE 浏览器用 13.333 。

  • 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 浏览器:

而对于 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

  • 上一篇网页设计:

  • 下一篇网页设计:
  • 最 新 热 门
     Flash as教程:图片模糊运动
     flash as简单制作飘雪动画
     Flash as3.0教程:弹性小球
     Flash ActionScript 3.0教程:学习Dot类
     Flash模拟地震摇晃动画效果
     Flash动画实例:柳枝,小鱼,涟漪和水波动画
     Flash鼠绘技巧:红绿色的树叶
     Flash实例教程:卡通MM眨眼睛动画
     Flash实例教程:休闲来喝茶吧!
     Flash入门实例:水滴动画制作
    最 新 推 荐
     基于XTHML标准的DIVCSS布局对SEO的影响
     CSS合理的编码与组织技巧
     网站变黑白灰色的4种代码详细讲解
     css布局实例:网页布局的方法
     网站变黑白色CSS一行代码实现
     YUI 中的 Grids CSS值得关注和学习的
     CSS代码是否合理?是否优化?
     网页制作人员在设计网页时注意的细节
     提高CSS文件可维护性的五种方法
     div+css网页适应不同分辨率技巧
    相 关 文 章

    浏览器Quirksmode模式与CSSCompat模式
    输入法下keyup失效的解决方案
    Flex Quick Starts中文翻译(三)
    Flex Quick Starts中文翻译(二)
    Flex Quick Starts中文翻译(一)
    Flash AS3.0中uint数据类型做循环判断应注意
    Adobe Flex Builder 2.0 Beta 3 配置方法
    Adobe Flex Builder 3 新功能预览
    FlashMX2004组件入门:UIObject
    javascri中ptignoreCase 属性

    | 设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | 网站公告

     

    Copyright 2006-2008 pcjx.com All Rights Reserved
    电脑技巧 版权所有 粤ICP备06059145号 地图
    本网站所有内容未经许可不得转载或做其他使用