textarea的属性是可以在内容过长有滚动条,在高版本的浏览器中还可以拖大输入框了,那么我们下文的重点就为各位介绍textarea去掉右侧滚动条和右下角拖拽的方法,具体如下。

我们经常会把去掉html页面的滚动条了,通常如下

掉左右滚动条,保留上下滚动条:

如果页面头部有:

需要去掉该代码,或者改为:

结果发现不能在textara中使用,找了一段css

body{

scrollbar-3dlight-color:#D4D0C8; /*- 最外左 -*/

scrollbar-highlight-color:#fff; /*- 左二 -*/

scrollbar-face-color:#E4E4E4; /*- 面子 -*/

scrollbar-arrow-color:#666; /*- 箭头 -*/

scrollbar-shadow-color:#808080; /*- 右二 -*/

scrollbar-darkshadow-color:#D7DCE0; /*- 右一 -*/

scrollbar-base-color:#D7DCE0; /*- 基色 -*/

scrollbar-track-color:#;/*- 滑道 -*/

}

测试发现也无效了,那么要怎么才可以去掉textarea右侧滚动条和右下角拖拽

在使用表单中的textarea标签时,有以下需要注意的地方:

1、去掉右侧滚动条:

2、去掉右下角的拖拽标记:

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

补充:隐藏textarea的滚动条

要设置textarea文本域的滚动条是否开启,使用style.overflow-x属性来控制。如:如果要隐藏该文本域的横向滚动条,在style属性中增加overflow-x属性控制,如下:

相应的,若要隐藏纵向滚动条:

如果使用代码控制的话,可能需要如下代码实现:

document.all("txtComments").style.overflowX="hidden";

overflow-x,overflow-y的可取值为:visible(默认取值),hidden,auto,scroll。

visible:始终不显示滚动条,文本区域的大小会根据内容的增加,自动增长,以显示全部内容。

scroll:不管文本区域里的内容有多少,始终显示滚动条。

hidden:始终不显示滚动条,内容超出层面的对象是不显示。

auto:如果内容在文本区域内可以全部显示,滚动条不显示,当内容无法全部显示时,内容被截断,加上滚动条显示所有内容。

html去掉右侧滚动条,html中去掉textarea右侧滚动条和右下角拖拽相关推荐

  1. html 右侧滚动条,html中去掉textarea右侧滚动条和右下角拖拽

    摘要 腾兴网为您分享:html中去掉textarea右侧滚动条和右下角拖拽,湘税社保,唯品会,上海交通,钱大掌柜等软件知识,以及玫瑰小镇魔法花园,raw格式转换软件,阳光天天购,live壁纸,废品机械 ...

  2. php去掉内部空格_php中去掉头尾空格3种方法

    在php中如果要替换所有空格我们有很多的方法,也有系统自带的函数了,但如果去除头尾空格好像是有一些区别了,下面我们来看3个php中去掉头尾空格例子. 看似很简单的问题,其实还是有点坑的,首先这里 空格 ...

  3. html中加滚动条,html中的div添加滚动条

    无标题文档 .css{ width:50px; border:1px solid red; /* overflow-x:scroll;左右滚动 overflow-x:scroll;上下滚动 overf ...

  4. vue 鼠标拖动画矩形_vue中拖动元素效果实现,以及拖拽`缩放后的元素`效果实现...

    START 番茄我又又又来写点啥了,最近被需求折磨的不要不要的,要做一个在线PPT做的网站.元素拖动算是其中一小部分的功能吧,但是还是出了很多的bug,这篇文章算是我对元素拖拽相关的记录吧. 仅以此文 ...

  5. vue+openlayers中实现图片展示与图片的拖拽和放大缩小(一)

    前言: openlayers中渲染图片是有多种方法的, Icon ,Image 等等都可以实现将图片放到地图上面,但是操作图片的话,方法比较少了,这里是配合 ol-ext 来实现的. 相关资料: 1. ...

  6. svg中text标签换行显示,并实现拖拽移动text标签

    如图,项目中需要一个在线批阅的功能,批阅者可以在线给word文档进行批注和打勾打叉等功能,后来又追加移动批注和批注换行的功能,想法就是用户通过\n或者按钮等操作对文本进行一个切割, 例如 图片中 的文 ...

  7. svg.draggable.js 实现动态向svg中添加图形和图片并可以拖拽

    源码: <!doctype html> <html> <head><meta charset="utf-8"><title&g ...

  8. EasyUI中放置Droppable的使用以及实现拖拽排序

    场景 效果 实现 webapp下新建droppable文件夹,在其下新建basic.html <!DOCTYPE html> <html lang="en"> ...

  9. HTML中拖动消失的球代码,js拖拽360桌面悬浮球代码

    原生js制作简单好用的360桌面悬浮球,可拖拽到浏览器边缘,自动贴边,自动适应屏幕效果. 使用方法: 1.head引入css文件 * { margin: 0; padding: 0; list-sty ...

  10. vue可视化拖拽生成工具_vdesjs: 基于vue的可视化拖拽,代码生成工具。提升前端开发效率,或者集成至项目作为在线拖拽工具。(持续迭代升级中)...

    vdesjs 介绍 vdesjs是一款基于vue技术栈,可视化拖拽,代码生成工具.我们提供详细的文档来帮助您理解我们工具的实现原理,并且您可以方便的基于vdesjs来扩展您自己的代码生成组件. 技术选 ...

最新文章

  1. 在Ubuntu 14.04 64bit上安装网易云音乐Linux版本(最新官方版)
  2. Rhythmk 学习 Hibernate 08 - Hibernate annotation 关联关系注解
  3. Spring集成web环境(手动实现)
  4. 浅析基于 Serverless 的前后端一体化框架
  5. Project Server 2010 好难装阿!
  6. Shell脚本学习-阶段三
  7. codeforces:ProblemMset
  8. 手把手教会你mp3音频转文字怎么操作,快来码住
  9. 共享打印机服务器系统64位,win7系统64位和winXP 32位共享网络打印机的操作方法...
  10. WeChat Subscribers Lite - 微信公众订阅号自动回复WordPress插件
  11. 小白如何打造一个基础的留言板网站(一)
  12. 深富策略:“石化双雄”爆发 市场不确定性增大
  13. Mendix装备制造业应用 | 云上全流程透明性备品备件协同管理
  14. Linux网站服务之部署Wordpress教程
  15. Docker 之 基操
  16. GBase 8c产品高级特性介绍
  17. 花呗能不能不还?支付宝说春节集五福中彩蛋可帮还
  18. 手工计算对数的方法和对应的C代码
  19. 中药材鉴别-方法:聚类;PCA 主成分分析;线性判别式分析;判别式检验
  20. c语言查找偶数,c-查找数字是偶数还是奇数的最快方法是什么?

热门文章

  1. Java编程思想读书笔记(一)第1~13、16章
  2. Dynamics Ax 2012中调用外部web服务
  3. 入选《PHP领域内容榜》,感谢CSDN,感谢各位浏览过我的朋友
  4. EXCEL VBA 操作图表
  5. “清华同方同传”By软件:同方易教管理平台 V2.4
  6. matlab如何预测数据,matlab预测数据
  7. python输出语句中引用多个变量
  8. python gdal帮助文档
  9. 测试用例场景法3个例子
  10. 3.4 小乌龟git使用说明