CSS3魔法堂：禁止用户改变textarea大小

1、前言　　　　　　　　　　　　　　　　　　　　　　　　　　

  在FF、Chrome和Safari下默认时容许用户以拖拽形式来改变textarea大小，这不只与IE下textarea的行为特色有异，并且textarea的大小变化会撑大其父节点从而破坏总体布局。

 

2、缘由　　　　　　　　　　　　　　　　　　　　　　　　　　 

经过调用 window.getComputedStyle(textarea元素, null).resize 返回both，咱们能够知道原来是resize样式属性搞的鬼。

 

3、CSS3属性──resize　　　　　　　　　　　　　　　　　　　　

用于设置UserAgent调整元素尺寸的机制，就是说设置用户可否和如何自行改变元素尺寸。

值范围

none：不容许UserAgent调整元素尺寸;

both ：容许UserAgent调整元素水平、垂直方向的尺寸;

vertical：容许UserAgent调整元素垂直方向的尺寸;

horizontal：容许UserAgent调整元素水平方向的尺寸;

inherit ：继承父元素

 

在FF、Chrome和Safari下

对于div来讲resize属性值时inherit（其实就是none），而对于textarea而言默认值为both。

 

4、解决办法　　　　　　　　　　　　　　　　　　　　　　　　

  为textarea设置 resize: none

 

尊重原创，转载请注明来自：http://www.cnblogs.com/fsjohnhuang/p/3940728.html ^_^肥仔John