textarea 在浏览器中固定大小和禁止拖动的实现方法


Posted in Javascript onDecember 03, 2016

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

可以通过添加如下两个样式禁用拖动,固定大小:

1:彻底禁用拖动(推荐)

resize: none;

2:只是固定大小,右下角的拖动图标仍在

width: 200px; 

height: 100px; 

max-width: 200px; 

max-height: 100px;

3:浏览器信息:

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

以上这篇textarea 在浏览器中固定大小和禁止拖动的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS array 数组详解
Mar 22 Javascript
date.parse在IE和FF中的区别
Jul 29 Javascript
javascript中字符串拼接详解
Sep 26 Javascript
JavaScript使用indexOf获得子字符串在字符串中位置的方法
Apr 06 Javascript
超详细的JS弹出窗口代码大全
Apr 18 Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
Oct 01 Javascript
bootstrap fileinput 插件使用项目总结(经验)
Feb 22 Javascript
AngularJS 最常用的八种功能(基础知识)
Jun 26 Javascript
JS非空验证及邮箱验证的实例
Aug 11 Javascript
详解微信小程序input标签正则初体验
Aug 18 Javascript
JS中使用new Option()实现时间联动效果
Dec 10 Javascript
linux服务器快速卸载安装node环境(简单上手)
Feb 22 Javascript
浅谈jQuery hover(over, out)事件函数
Dec 03 #Javascript
jquery 多个radio的click事件实例
Dec 03 #Javascript
jquery点击展示与隐藏更多内容
Dec 03 #Javascript
Javascript 实现放大镜效果实例详解
Dec 03 #Javascript
bootstrap模态框垂直居中效果
Dec 03 #Javascript
JS制作类似选项卡切换的年历
Dec 03 #Javascript
JS键盘版计算器的制作方法
Dec 03 #Javascript
You might like
PHP 命令行工具 shell_exec, exec, passthru, system详细使用介绍
2011/09/11 PHP
PHP中数字检测is_numeric与ctype_digit的区别介绍
2012/10/04 PHP
浅谈php扩展imagick
2014/06/02 PHP
Zend Framework数据库操作方法实例总结
2016/12/11 PHP
PDO::setAttribute讲解
2019/01/29 PHP
Laravel Eloquent ORM 多条件查询的例子
2019/10/10 PHP
获取当前网页document.url location.href区别总结
2008/05/10 Javascript
javascript数组的扩展实现代码集合
2008/06/01 Javascript
JavaScript 异步调用框架 (Part 6 - 实例 & 模式)
2009/08/04 Javascript
JS读取cookies信息(记录用户名)
2012/01/10 Javascript
jquery中focus()函数实现当对象获得焦点后自动把光标移到内容最后
2013/09/29 Javascript
javascript中不提供sleep功能如何实现这个功能
2014/05/27 Javascript
15个值得开发人员关注的jQuery开发技巧和心得总结【经典收藏】
2016/05/25 Javascript
页面get请求 中文参数方法乱码问题的快速解决方法
2016/05/31 Javascript
easyui form validate总是返回false的原因及解决方法
2016/11/07 Javascript
Bootstrap基本插件学习笔记之标签切换(17)
2016/12/08 Javascript
javascript将json格式数组下载为excel表格的方法
2017/12/22 Javascript
AngularJS模态框模板ngDialog的使用详解
2018/05/11 Javascript
Vue.js实现的计算器功能完整示例
2018/07/11 Javascript
基于JavaScript实现十五拼图代码实例
2020/04/26 Javascript
Python Tkinter GUI编程入门介绍
2015/03/10 Python
Python面向对象编程中的类和对象学习教程
2015/03/30 Python
Python3.x中自定义比较函数
2015/04/24 Python
解析Python中的异常处理
2015/04/28 Python
Python打包可执行文件的方法详解
2016/09/19 Python
Python在图片中添加文字的两种方法
2017/04/29 Python
在python带权重的列表中随机取值的方法
2019/01/23 Python
python3中for循环踩过的坑记录
2020/12/14 Python
CSS3解析抖音LOGO制作的方法步骤
2019/04/11 HTML / CSS
html5 Canvas画图教程(5)—canvas里画曲线之arc方法
2013/01/09 HTML / CSS
浅析HTML5 meta viewport参数
2020/10/28 HTML / CSS
学校安全生产承诺书
2014/05/23 职场文书
小学母亲节活动总结
2015/02/10 职场文书
心灵点滴观后感
2015/06/02 职场文书
星际争霸:毕姥爷vs解冻01
2022/04/01 星际争霸
Go并发4种方法简明讲解
2022/04/06 Golang