textarea 如何设置滚动条_教程

在测试scrollWidth、clientWidth、offsetWidth时需要让<textarea>可以出现水平滚动条，但是发现<textarea>默认会自动换行，不能直接出现水平滚动条，所以为了实现该效果，需要对<textarea>做一些处理，输入<textarea wrap="off" style="overflow:scroll"></textarea>就可以设置滚动条了。

扩展资料：

常见功能

1、自动完成

自动完成的快捷键是Tab，如果在html文件中，输入cl按下tab，即可自动补全为class=””加上zencoding后，更是如虎添翼，后面再讲到

2、多列编辑

按住ctrl点击鼠标，会出现多个闪烁的光标，这时可同时修改多处，或者按住鼠标中键拖拽。

3、代码注释功能

ctrl+/、ctrl+shift+/分别为行注释和块注释，再按一下就能去掉注释，ST2能够自动识别是html、css还是js文件，给出不同类型的注释。

4、行 *** 作

ctrl+alt+↑、ctrl+alt+↓向上或者向下交换两行，ctrl+enter，光标后插入空行，ctrl+d选择相似，可以参考后面的快捷键列表。

参考资料来源：百度百科-Sublime

用css设置textarea代码如下：

border-radius:20px；

resize:none

1．overflow内容溢出时的设置（设定被设定对象是否显示滚动条）

overflow-x水平方向内容溢出时的设置

overflow-y垂直方向内容溢出时的设置

以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。

2．scrollbar-3d-light-color立体滚动条亮边的颜色（设置滚动条的颜色）

scrollbar-arrow-color上下按钮上三角箭头的颜色

scrollbar-base-color滚动条的基本颜色

scrollbar-dark-shadow-color立体滚动条强阴影的颜色

scrollbar-face-color立体滚动条凸出部分的颜色

scrollbar-highlight-color滚动条空白部分的颜色

scrollbar-shadow-color立体滚动条阴影的颜色

我们通过几个实例来讲解上述的样式属性：

1.让浏览器窗口永远都不出现滚动条

没有水平滚动条

没有垂直滚动条

没有滚动条

<body style= "overflow-x:hiddenoverflow-y:hidden ">或 <body

style= "overflow:hidden ">

2.设定多行文本框的滚动条

没有水平滚动条

没有垂直滚动条

没有滚动条

或 <textarea style= "overflow:hidden "></textarea>

3.设定窗口滚动条的颜色

设置窗口滚动条的颜色为红色 <body style= "scrollbar-base-color:red ">

scrollbar-base-color设定的是基本色，一般情况下只需要设置这一个属性就可以达到改变滚动条颜色的目的。

加上一点特别的效果：

4.在样式表文件中定义好一个类，调用样式表。

<style>

.coolscrollbar{scrollbar-arrow-color:yellowscrollbar-base-color:lightsalmon}

</style>

这样调用：

1、选中其ID设置click点击事件。

2、选中输入框的名称class等于kk。

3、设置属性slideToggle(下拉显示或上升隐藏.)。HBuilder是当前最快的HTML开发工具，强大的代码助手帮你快速完成开发，最全的语法库和浏览器兼容性数据。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/tougao/11193780.html

textarea 如何设置滚动条

发表评论

评论列表（0条）