Bubblings Blog

深入理解 IE haslayout

无意间翻阅自己以前写的文章,发现css学习笔记系列文章有很长一段时间没更新了。懒惰这东西有时确实挺可怕的,它会慢慢吞噬着你的斗志和决心。要不是最近准备换工作,可能又不知道什么时候才能想起温习这些知识了。刚好后面这几天事情不多,把之前落下了的文章给补上。今天先来学习haslayout。

1.什么是haslayout

layout是windows IE的一个私有概念,它决定了元素如何对其内容定位和尺寸计算,以及与其他元素的关系和相互作用。当一个元素“拥有布局”时,它会负责本身及其子元素的尺寸和定位。而如果一个元素“没有拥有布局”,那么它的尺寸和位置由最近的拥有布局的祖先元素控制。

必须说明的是,IE8及以上浏览器使用了全新的显示引擎,已经不在使用haslayout属性,因此文中提到的haslayout属性只针对IE6和IE7。

css样式缩写知多少

css缩写 不仅能高效率的控制页面表现,而且还能使css文件变得更小、更有条理,也是 前端工程师必备的素质之一。虽然《精通css》中没有专门介绍缩写的专题,但是在各章零碎的都有所提及,所以还是做一个总结,也方面日后查阅。

1.色值缩写

色值的缩写比较简单,一般最常用的就是两种情况,如:

color:#336699

可以缩写成

color:#369    

2.background缩写

背景在css中也经常用到,涉及到背景的相关属性及值如下:

background-color: color;
background-image:url(...);
background-repeat: repeat || repeat-x || repeat-y || no-repeat;
background-attachment: scroll || fixed; 
background-position: X Y;

常见的缩写方式:

background:url(...) no-repeat 0 0;    //纯背景图片
background:#ccc url(...) no-repeat 0 0;    //背景颜色+图片
background:transparent none repeat scroll top left;    //也可把属性补全