resize ： none | both | horizontal | vertical | inherit
相关属性： N/A
css resize调节元素尺寸大小 右下角可拖动【CSS3.0参考手册】
使用resize可以在元素上拖动 来自己改变元素大小，调节尺寸，和chrome文本框默认的样式相同，在右下角出现拖动的小图标
语法：
取值：
- none：
- UserAgent没提供尺寸调整机制，用户不能操纵机制调节元素的尺寸。
- both：
- UserAgent提供双向尺寸调整机制，让用户可以调节元素的宽度和高度。
- horizontal：
- UserAgent提供单向水平尺寸调整机制，让用户可以调节元素的宽度。
- vertical：
- UserAgent提供单向垂直尺寸调整机制，让用户可以调节元素的高度。
- inherit：
- 默认继承。
说明：
使元素的区域可缩放，调节元素尺寸大小。适用于任意获得"overflow"条件的容器。
兼容性：
| 类型 | Internet Explorer | Firefox | Chrome | Opera | Safari |
|---|---|---|---|---|---|
| 版本 | (×)IE6 | (×)Firefox 2.0 | (√)Chrome 1.0.x | (×)Opera 9.63 | (√)Safari 3.1 |
| (×)IE7 | (×)Firefox 3.0 | (√)Chrome 2.0.x | (√)Safari 4 | ||
| (×)IE8 | |||||
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css resize调节元素尺寸大小 右下角可拖动</title>
</head>
<body>
<div style="width:300px;height:80px;padding:16px;border:1px solid;resize:both;overflow: auto;">Safari、Chrome允许元素的缩放的,但尚未完全支持，目前只允许双向调整。CSS3允许你将这个属性应用到任意元素，这将使缩放这个功能拥有跨浏览器的支持。</div>
</body>
</html>
来源：//作者：/更新时间：2014-01-20
顶
踩
相关文章：
