textarea禁止拉伸，禁止拖拽大小

本文介绍如何通过css样式设置textarea属性设置textarea大小，禁止随意拉伸和拖拽大小，实现固定大小。

html实现代码如下

<textarea id="test" style="height:100px;width:200px;resize: none;"></textarea>

测试环境

Mozilla/5.0 (Windows NT 5.1) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/13.0.782.218 Safari/535.1

禁止拖拽大小代码说明

resize: none;彻底禁用拖动
width: 200px;
height: 100px;
max-width: 200px;
max-height: 100px;

实现的效果是：只是固定大小，右下角的拖动图标仍在，见一下效果图。

其实HTML 标签 textarea 在大部分浏览器中只要指定行（rows）和列（cols）属性，就可以规定 textarea 的尺寸，大小就不会改变，不过更好的办法是使用 CSS 的 height 和 width 属性,但是Chrome,Safari和FireFox渲染的效果不同，可以拖动右下角图标改变大小。但是过分拖动大小会影响页面布局，使页面变得不美观。

更多相关推荐

• css3排除选择器not()-实现反选|除了的效果
• css怎么设置透明度
• div在body中水平居中和垂直居中对齐的方法总结