水滴365博客主要分享一些生活中的经验和IT技术自学过程中积累的技术、学习资源和软件资源等。座右铭:坚持+自律=开挂人生。
当前位置: 首页 > 网站建设 > textarea禁止拉伸,禁止拖拽大小

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

标签: html

本文介绍如何通过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;

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

固定的textarea

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



更多相关推荐

版权保护:本文《textarea禁止拉伸,禁止拖拽大小》由<我爱分享>原创,转载请保留链接:http://shuidi365.cn/site/95.html

相关推荐
  • 没有相关文章

此博客主要用来分享、推荐自己日常、学习过程中感觉比较实用的经验、IT技术和一些比较好的资源(各种软件、各种开发手册、各种学习资料、各种视频教程等),希望对大家有所帮助,有问题请留言,欢迎来交流,联系QQ邮箱/微信:342807450

合作伙伴
冀ICP备19020226号-1 冀公网安备 13010902000246号