在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等。

下载safari ：

PS:这个下载的按钮，是来自于Safari下载的官方页面，细心的童鞋会发现，这个按钮的风格显然不是apple的风格了，更像Firefox下载页面的那个绿色的按钮的风格。

怎样解决DIV层被Flash动画遮盖问题？ 为什么设计师需要学习编写代码

评论 (0) All