對CSS中zoom屬性的總結

在css中，zoom屬性作用是設定或檢索物件的縮放比例。對應的腳本特性為zoom。雖然很多人都知道，但是任然有人不知道zoom的具體的用法，或者沒有深究過，下面就把zoom的用法總結一下：

1.CSS樣式中屬性zoom：1的作用詳解

CSS中zoom:1的作用
相容IE6、IE7、IE8瀏覽器，常會遇到一些問題，可以使用zoom:1來解決，有如下作用：
觸發IE瀏覽器的haslayout
解決ie下的浮動，margin重疊等一些問題。

2.CSS中zoom屬性或overflow:auto屬性清除浮動

其實在CSS中的Zoom這個屬性一般不不為人知，甚至有些CSS手冊中都查詢不到。其實Zoom屬性是IE瀏覽器的專有屬性，Firefox等瀏覽器不支援。它可以設定或檢索物件的縮放比例。除此之外，它還有其他一些作用，例如觸發ie的hasLayout屬性，清除浮動、清除margin的重疊等。

3.zoom和transform:scale()的差異

zoom和transform:scale()都可以用來縮放，目前行動端存在各種不同螢幕大小的手機，為了相容不同寬度的螢幕，我們可以基於某一螢幕寬度大小（例如iPhone5的320，這個依照設計稿來）做出頁面後，再對頁面進行縮放以相容於其他螢幕寬度。

4.css中的zoom的使用

zoom : normal | number 
normal :　 預設值。使用物件的實際尺寸 
number :　 百分數 | 無符號浮點實數。浮點實數值為1.0或百分數為100%時相當於此屬性的 normal 值用白話講解就是zoom:後面的數字即放大的倍數，可 以是數值，也可以是百分比。如：zoom:1，zoom:120%。

ps：網路上都說是ie的專有屬性，本人親測chrome下也可以使用；（Firefox瀏覽器不支援）

zoom屬性相關的問答：

1.css zoom 如何計算控制頁面大小？

2.zoom 放大背景圖怎麼會從頁面左上角開始放大的？

3.使用css中的zoom:50%後對頁面文字大小不生效，什麼原因？

以上是對CSS中zoom屬性的總結的詳細內容。更多資訊請關注PHP中文網其他相關文章！