css中的zoom的使用

zoom : normal | number
normal :　 默認(rèn)值。使用對(duì)象的實(shí)際尺寸
number :　 百分?jǐn)?shù) | 無(wú)符號(hào)浮點(diǎn)實(shí)數(shù)。浮點(diǎn)實(shí)數(shù)值為1.0或百分?jǐn)?shù)為100%時(shí)相當(dāng)于此屬性的 normal 值用白話講解就是zoom:后面的數(shù)字即放大的倍數(shù)，可 以是數(shù)值，也可以是百分比。如：zoom:1，zoom:120%。

ps：網(wǎng)上都說(shuō)是ie的專有屬性，本人親測(cè)chrome下也可以使用；（Firefox瀏覽器不支持）

實(shí)例一：

.first-p{ 
 width: 100px; 
 height: 100px; 
 background: red; 
 zoom:1; 
 float: left 
 } 
 .second-p{ 
 width: 100px; 
 height: 100px; 
 background: green; 
 zoom:1.5; 
 float:left 
 } 
 .third-p{ 
 width: 100px; 
 height: 100px; 
 background: blue; 
 zoom:2; 
 float:left 
 }

html

 <p class="first-p"></p> 
 <p class="second-p"></p> 
 <p class="third-p"></p>

效果：

ps：p本身的大小是100，結(jié)果被放大了，和css3中的縮放有有較的卻別之一：放大 縮小多少倍，就占據(jù)多大的dom空間；

css中的縮放，占據(jù)的依然是元素本身設(shè)置的width 和 height 屬性滴呀

使用方式：比如觸發(fā)ie的hasLayout屬性，清除浮動(dòng)、清除margin的重疊等。

{:;:;:;:;

 
 }{:;:;:;:; 
 }

上面的做法已經(jīng)能解決現(xiàn)代瀏覽器上的問(wèn)題了；如要要向下兼容ie6 就要加上zoom:1。

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com