textarea 滚动条属性设置
转载: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 滚动条属性设置的更多相关文章
- 前端学习笔记之CSS属性设置
CSS属性设置 阅读目录 一 字体属性 二 文本属性 三 背景属性 四 盒子模型 五 盒子模型各部分详解 一 字体属性 1.font-weight:文字粗细 取值 描述 normal 默认值,标准 ...
- DEV控件GridControl常用属性设置
1. 如何解决单击记录整行选中的问题 View->OptionsBehavior->EditorShowMode 设置为:Click 2. 如何新增一条记录 (1).gridView.Ad ...
- DevExpress GridView属性设置 z
本文主要总结控件的属性设置,附上图片,给大家一个参考.后续会给大家分享功能实现和使用的小技巧. GirdControl是数据的容器,它包含多种显示方式,GridView则是一种二维表格视图. 绑定数据 ...
- (转)DevExpress GridView属性设置
GirdControl是数据的容器,它包含多种显示方式,GridView则是一种二维表格视图. 绑定数据源: List<Student> list = new List<Studen ...
- mvc中动态给一个Model类的属性设置验证
原文:mvc中动态给一个Model类的属性设置验证 在mvc中有自带的验证机制,比如如果某个字段的类型是数字或者日期,那么用户在输入汉字或者英文字符时,那么编译器会自动验证并提示用户格式不正确,不过这 ...
- DEV控件GridControl常用属性设置(转)
1. 如何解决单击记录整行选中的问题 View->OptionsBehavior->EditorShowMode 设置为:Click 2. 如何新增一条记录 (1).gridView. ...
- 转:c# WinForm开发 DataGridView控件的各种操作总结(单元格操作,属性设置)
一.单元格内容的操作 *****// 取得当前单元格内容 Console.WriteLine(DataGridView1.CurrentCell.Value); // 取得当前单元格的列 Index ...
- Dev属性设置
DisplayFormat 设置显示格式如:{0:P}表示显示为百分号模式.如数据源中为0.5.表示出来为50% 2.GridContro总合计及分组合计: 常规总合计直接RunDesigner-Gr ...
- DEVexpress GridControl 属性设置
1. 如何解决单击记录整行选中的问题 View->OptionsBehavior->EditorShowMode 设置为:Click 2. 如何新增一条记录 (1).gridView.Ad ...
随机推荐
- LDAP常用属性及其描述
属性 全名 描述 dn distinguished name 唯一标识名,类似于绝对路径,每个对象都有唯一标识名. 例如:uid=tester,ou=People,dc=example,dc=com ...
- 基于Redis的CAS集群
单点登录(SSO)是复杂应用系统的基本需求,Yale CAS是目前常用的开源解决方案.CAS认证中心,基于其特殊作用,自然会成为整个应用系统的核心,所有应用系统的认证工作,都将请求到CAS来完成.因此 ...
- AEAI DP开发统计分析
1 背景概述 平时做统计分析都是调rest服务,给前台提供数据,然后在管理控制台里配置portlet.但并不是所有的项目都会用到portal,这时就需要在AEAI DP应用开发平台里开发统计分析了,下 ...
- C# MemoryStream BinaryReader
不清楚这类东西内部搞什么鬼,直接看代码才舒爽 https://referencesource.microsoft.com/#mscorlib 然后可以在线测试 https://www.tutorial ...
- 同一域名基于源ip地址分配给不同ip的dns配置--bind9.8.2
1.安装bind.略. 2./etc/named.conf配置文件. // named.conf // // Provided by Red Hat bind package to configure ...
- 详述MSSQL服务在渗透测试中的利用(上篇)
前言: 致力于复现最实用的漏洞利用过程. 本文将带领大家学习以下内容: 学习使用`xp_cmdshell`扩展存储过程 学习调用`wscript.shell` 学习MSSQL写文件 学习沙盘模式提权 ...
- 跟着刚哥学习Spring框架--JDBC(六)
Spring的JDBC框架 Spring JDBC提供了一套JDBC抽象框架,用于简化JDBC开发. Spring主要提供JDBC模板方式.关系数据库对象化方式.SimpleJdbc方式.事务管理来简 ...
- [Visual Studio] 记一次排错:打不开 Nuget 包管理器里的安装package页面,无法 安装 / 恢复 包
出差一阵子PC很久没用了, 回来在用Visual Studio (2017) 的时候, 工程里无法安装Package了 >_< --- 也不知道电脑做了什么?--- Nuget包管 ...
- df换行问题解决
df换行问题解决 df是linux下用来查磁盘空间的命令,而在使用了LVM分区或网络挂载的情况下,再用df取分区的使用率时,发现有些分区显示换行了,这样会导致通过脚本取的数据不对. [root@ ]# ...
- 11-02 Java Object类使用详解
Object 作为超类 Object是类层次结构的根类,所有的类都直接或者间接的继承自Object类. Object类的构造方法有一个,并且是无参构造,这其实就是理解当时我们说过,子类构造方法默认访 ...