转载：http://www.cnblogs.com/JensonBin/archive/2011/02/23/1962099.html

scrollbar属性、样式详解
1．overflow内容溢出时的设置（设定被设定对象是否显示滚动条）
    overflow-x水平方向内容溢出时的设置
    overflow-y垂直方向内容溢出时的设置
    以上三个属性设置的值为visible(默认值)、scroll（显示）、hidden（隐藏）、auto（自动）。

　例如：显示y轴下拉条：  style="overflow-y:scroll"

 行数  rows="15" 列数 cols="45"
<textarea rows="15" cols="45" placeholder="请输入不超过500字"  style="overflow-y:scroll"></textarea>

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:hidden">
    没有垂直滚动条
    <body style="overflow-y:hidden">
    没有滚动条
    <body style="overflow-x:hidden;overflow-y:hidden">或<body 
    style="overflow:hidden">

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

没有水平滚动条
   <textarea style="overflow-x:hidden"></textarea>

没有垂直滚动条
   <textarea style="overflow-y:hidden"></textarea>

没有滚动条
   <textarea style="overflow-x:hidden;overflow-y:hidden"></textarea>
   或<textarea style="overflow:hidden"></textarea>

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

设置窗口滚动条的颜色为红色<body style="scrollbar-base-color:red">
scrollbar-base-color设定的是基本色，一般情况下只需要设置这一个属性就可以达到改变滚动条颜色的目的。
加上一点特别的效果：
<body style="scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon">

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

<style>
.coolscrollbar{scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon;}
</style>
这样调用：
<textarea class="coolscrollbar"></textarea>

Scrollbar-Face-Color为滚动条表面颜色设定；
Scrollbar-Highlight-Color为滚动条上斜面和左斜面颜色设定；
Scrollbar-Shadow-Color为滚动条下斜面和右斜面颜色设定；
Scrollbar-3Dlight-Color为滚动条上边和左边的边沿颜色设定；
Scrollbar-Arrow-Color为滚动条两端箭头颜色设定。
Scrollbar-Track-Color为滚动条底板颜色设定；
Scrollbar-Darkshadow为滚动条下边和右边边沿颜色设定。

举例：

body { 
background-color: #ffffff; 
color: #336699; 
SCROLLBAR-FACE-COLOR: #BED8EB; 
SCROLLBAR-SHADOW-COLOR: #DDF8FF; 
SCROLLBAR-HIGHLIGHT-COLOR: #92C0D1; 
SCROLLBAR-3DLIGHT-COLOR: #DDF8FF; 
SCROLLBAR-DARKSHADOW-COLOR: #92C0D1; 
SCROLLBAR-TRACK-COLOR:#BED8EB; 
SCROLLBAR-ARROW-COLOR: #92C0D1 
}

textarea 滚动条属性设置的更多相关文章

  1. 前端学习笔记之CSS属性设置

    CSS属性设置   阅读目录 一 字体属性 二 文本属性 三 背景属性 四 盒子模型 五 盒子模型各部分详解 一 字体属性 1.font-weight:文字粗细 取值 描述 normal 默认值,标准 ...

  2. DEV控件GridControl常用属性设置

    1. 如何解决单击记录整行选中的问题 View->OptionsBehavior->EditorShowMode 设置为:Click 2. 如何新增一条记录 (1).gridView.Ad ...

  3. DevExpress GridView属性设置 z

    本文主要总结控件的属性设置,附上图片,给大家一个参考.后续会给大家分享功能实现和使用的小技巧. GirdControl是数据的容器,它包含多种显示方式,GridView则是一种二维表格视图. 绑定数据 ...

  4. （转）DevExpress GridView属性设置

    GirdControl是数据的容器,它包含多种显示方式,GridView则是一种二维表格视图. 绑定数据源: List<Student> list = new List<Studen ...

  5. mvc中动态给一个Model类的属性设置验证

    原文:mvc中动态给一个Model类的属性设置验证 在mvc中有自带的验证机制,比如如果某个字段的类型是数字或者日期,那么用户在输入汉字或者英文字符时,那么编译器会自动验证并提示用户格式不正确,不过这 ...

  6. DEV控件GridControl常用属性设置（转）

      1. 如何解决单击记录整行选中的问题 View->OptionsBehavior->EditorShowMode 设置为:Click 2. 如何新增一条记录 (1).gridView. ...

  7. 转：c# WinForm开发 DataGridView控件的各种操作总结（单元格操作，属性设置）

    一.单元格内容的操作 *****// 取得当前单元格内容 Console.WriteLine(DataGridView1.CurrentCell.Value); // 取得当前单元格的列 Index  ...

  8. Dev属性设置

    DisplayFormat 设置显示格式如:{0:P}表示显示为百分号模式.如数据源中为0.5.表示出来为50% 2.GridContro总合计及分组合计: 常规总合计直接RunDesigner-Gr ...

  9. DEVexpress GridControl 属性设置

    1. 如何解决单击记录整行选中的问题 View->OptionsBehavior->EditorShowMode 设置为:Click 2. 如何新增一条记录 (1).gridView.Ad ...

随机推荐

  1. 使用python来批量抓取网站图片

    今天"无意"看美女无意溜达到一个网站,发现妹子多多,但是可恨一个page只显示一张或两张图片,家里WiFi也难用,于是发挥"程序猿"的本色,写个小脚本,把图片扒 ...

  2. 基于opencv3.0下的人脸检测和检测部分的高斯模糊处理

    如题 这里将任务分解为三大部分: 1.录播放视频 2.人脸检测 3.部分高斯模糊 其中重点放在人脸检测和部分高斯模糊上 1.录播放视频(以opencv中的VideoCapture类进行实现) 首先罗列 ...

  3. 3.怎样将ASP.NET MVC应用程序发布到IIS

    这一篇,教大家怎么将ASP.NET MVC应用程序发布到本地或者IIS中.打开上一篇创建的ASP.NET MVC 5.0应用程序.[PS:上一篇--->2.第一个ASP.NET MVC 5.0应 ...

  4. Python运维脚本整理

    Python 实现的自动化服务器管理 import sys import os import paramiko ssh = paramiko.SSHClient() ssh.set_missing_h ...

  5. cad2020卸载/安装失败/如何彻底卸载清除干净cad2020注册表和文件的方法

    cad2020提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装cad2020失败提示cad2020安装未完成,某些产品无法安装,也有时候想重新安装cad2020 ...

  6. Java几种单例模式的实现与利弊

    饿汉式 提前new出来实例了,并不是在第一次调用get方法时才实例化,没有进行延迟加载 public class Singleton1 { private static Singleton1 inst ...

  7. Redis---quickList(快速列表)

    1. 概述 考虑到链表的附加空间相对太高,prev 和 next 指针就要占去 16 个字节 (64bit 系统的指针是 8 个字节),另外每个节点的内存都是单独分配,会加剧内存的碎片化,影响内存管理 ...

  8. redis哨兵集群环境搭建

    一.哨兵的介绍 哨兵(sentinal)是redis集群架构中非常重要的一个组件,主要功能如下: 集群监控,负责监控redis master和slave进程是否正常工作 消息通知,如果某个redis实 ...

  9. 解决白屏（vue） - webpace es6转es5

    1.npm安装 npm install babel-polyfillnpm install es6-promise package.json中会出现 "babel-polyfill" ...

  10. Python标准库 -- UUID模块(生成唯一标识)

    UUID是什么: UUID: 通用唯一标识符 ( Universally Unique Identifier ),对于所有的UUID它可以保证在空间和时间上的唯一性,也称为GUID,全称为: UUID ...