Apple Safari 4 新特性

在WWDC 2009上，Apple發佈了正式版的Safari 4瀏覽器，正式版的safari 4放棄了仿Chrome的tab方式，還原至3.0版本的界面。據稱，WWDC上，Serlet 嚴重的BS了一下微軟的IE8瀏覽器，並稱Safari的JavaScript引擎是目前世界上最快的，根據他提供的測試數據，Chrome 2的速度是IE8的5.3倍，而Safari4的速度則是IE8的7.8倍！

這些數據大多是官方的噱頭，我們就先不管啦，看看Safari4會對我們前端開發有哪些影響吧：

HTML 5

支持Audio和video標籤。

CSS

Safari4對CSS的支持有較多改進，具體如下：

ZOOM

Safari 4開始支持zoom屬性。這一點兒的用法和效果和IE瀏覽器一直。不同的是，如果是縮放，Safari會縮小到瀏覽器支持的最小字體，而IE會直接縮小到設置的大小。比如：


程序代碼
.zoomTest{font-size:12px; zoom:0.1}

Safari只會縮小至9px字體大小，而IE會縮小至1.2px(肉眼已經看不清了)。

-webkit-animation

有一系列子屬性組成：

-webkit-animation-name 為動畫指定一個名稱
-webkit-animation-duration 動畫持續時間
-webkit-animation-timing-function 動畫幀切換方式，也就是動畫效果，大概有ease、linear、ease-in、ease-out、ease-in-out這幾種。
-webkit-animation-delay 定義動畫開始時間
-webkit-animation-iteration-count 動畫重複次數
-webkit-animation-direction 動畫方向，有兩個屬性：normal，正向播放； alternate，交替方向，第偶數次正向播放，第奇數次反向播放。

-webkit-mask

CSS遮罩/蒙板效果

-webkit-mask-attachment 兩個值：fixed和scroll；
-webkit-mask-clip 元素邊框的剪切效果 ；
-webkit-mask-position 用法類似background-position屬性。
-webkit-mask-origin 規定-webkit-mask-position屬性的錨記。有border、content、和padding三個屬性。
-webkit-mask-image 元素的蒙板圖片，值為圖片路徑；
-webkit-mask-repeat 重複性設定，
-webkit-mask-composite 混合樣式。默認為border，也就是背景延伸到border區域。還可以設置為padding。

其它改進

Safari4同時增加或增強了其它一些CSS屬性支持，比如，background-position開始支持動畫效果，這裡就不再贅述。

可以看出，Safari新增的這些CSS屬性，並非W3C標準中的內容，不過這些webkit的私有屬性，的確可以讓我們開發出更好的網絡應用。

WAI-ARIA 角色

想必對WAI-ARIA瞭解的人不是很多。WAI-ARIA即W3C Web Accessibility Initiative Accessible Rich Internet Applications，中文翻譯為「無障礙富互聯網應用程序」。同時W3C制定了WAI-ARIA角色標準。Google前不久宣佈將大力支持WAI-ARIA，而且其Google reader的屏幕閱讀功能即是通過WAI-ARIA實現的。目前，Firefox已經開始支持WAI-ARIA，IE8部分支持。Safari 4也開始支持WAI-ARIA角色。查看Safari 4對WAI-ARIA的支持情況...

值得注意的是，WAI-ARIA貌似僅支持div和span標籤，為了配合WAI-ARIA，Safari同時添加了HTML的一些支持屬性，比如aria-checked/aria-level/aria-valuemax/aria-valuemin等。



PS：這個下載的按鈕，是來自於Safari下載的官方頁面，細心的童鞋會發現，這個按鈕的風格顯然不是apple的風格了，更像Firefox下載頁面的那個綠色的按鈕的風格。

原文：點這裡...

文章來自 BAYSTARS DESIGN網頁設計公司