9、Resize

只有Firefox 4和Safari 3支持此属性。Resize是CSS3 UI模型中的一部分，可用于重定义textarea的大小。

<textarea id=”elem” rows=”5″ cols=”50″></textarea>

默认情况下webkit浏览器和Firefox 4支持水平和垂直方向上的重定义。

textarea { 
-moz-resize: vertical; 
-webkit-resize: vertical; 
resize: vertical; 
}

可能的值：

both:	重定义水平和垂直方向
horizontal:	水平调整大小限制
vertical:	垂直调整大小限制
none:	不支持重定义

10、Transition

也许CSS3最令人兴奋的增补，就是在没有 JavaScript 的元素的情况下产生动画。

好像IE9还不支持此功能，但这并不代表你不能使用这个功能，关键是在于提高技能。

现在模仿一个效果，当鼠标滑过右侧链接时，文本向右滑动。

The HTML

<ul> 
<li> 
<a href=”#”> Hover Over Me </a> 
</li> 
<li> 
<a href=”#”> Hover Over Me </a> 
</li> 
<li> 
<a href=”#”> Hover Over Me </a> 
</li> 
<li> 
<a href=”#”> Hover Over Me </a> 
</li> 
</ul>

The CSS

ul a { 
-webkit-transition: padding .4s; 
-moz-transition: padding .4s; 
-o-transition: padding .4s; 
transition: padding .4s; 
} 
a:hover { 
padding-left: 6px; 
}

出处：蓝色理想
责任编辑：bluehearts

上一页 你需要熟知10个的CSS3属性 [8] 下一页 你需要熟知10个的CSS3属性 [10]

◎进入论坛网页制作、WEB标准化版块参加讨论，我还想发表评论。