1,Overflow内容溢出时的设置

overflow 水平及垂直方向内容溢出时的设置
overflow-x 水平方向内容溢出时的设置
overflow-y 垂直方向内容溢出时的设置

以上三个属性设置的值为visible、scroll、hidden、auto

visible 默认值。使用该值时，无论设置的"width"和"height"

的值是多少，其中的内容无论是否超出范围都将被强制显示。
hidden 效果与visible相反。任何超出"width"和"height"的内

容都会不可见。
scroll 无论内容是否超越范围，都将显示滚动条。
auto 当内容超出范围时，显示滚动条，否则不显示。

应用:

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

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

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

style="overflow:hidden">test</div>

自动显示滚动条
<div

style="height:100px;width:100px;overflow:auto;">test</di

v>

2,自己定义滚动条的颜色

我们一般默认的滚动条样式如下左图,右图是放大了1600倍的样

子,我们可以看到滚动条有几种言责组合的,我给他们标了7个号,

分别注释在下面的css代码的后面了,注意css的注释代码是放在

两个斜杠内的两个星号之间,如:/*这里放注释的代码*/

Body {
scrollbar-arrow-color: #f4ae21; /*图6,三角箭头的颜色*/
scrollbar-face-color: #333; /*图5,立体滚动条的颜色*/
scrollbar-3dlight-color: #666; /*图1,立体滚动条亮边的颜

色*/
scrollbar-highlight-color: #666; /*图2,滚动条空白部分的

颜色*/
scrollbar-shadow-color: #999; /*图3,立体滚动条阴影的颜

色*/
scrollbar-darkshadow-color: #666; /*图4,立体滚动条强阴

影的颜色*/
scrollbar-track-color: #666; /*图7,立体滚动条背景颜色*/

scrollbar-base-color:#f8f8f8; /*滚动条的基本颜色*/
Cursor:url(mouse.cur); /*自定义个性鼠标*/
}

以上2项适用与<body>、<div>、<textarea>、<iframe>

css 滚动条样式的更多相关文章

  1. HTML+CSS 滚动条样式自定义 - 适用于 div,iframe, html 等

    友言:这两天被滚动条整的无与伦比,在此做下总结: 首先自定义浏览器滚动条的实现原理:计算浏览器滚动条的高度,层级1的高度与滚动条的总高度是一样的,通过相似比例计算: 浏览器滚动条总高度 :滚动条高度 ...

  2. css滚动条样式修改

    .activeMoreBankList{ height: 188px; overflow-y: auto;} /*滚动条样式*/.activeMoreBankList::-webkit-scrollb ...

  3. CSS滚动条样式设置

    webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ...

  4. [CSS]滚动条样式设置

    概述 最近项目中需要,将一个页面嵌入在一个webbrower中,这个webrower是定高的,在页面内容超过webbrower高度时,需要以滚动条的形式展现,当时也考虑了使用webbrower的滚动条 ...

  5. CSS滚动条样式定制

    效果图如下 <!DOCTYPE html> <!-- saved from url=(0061)http://www.xuanfengge.com/demo/201311/scrol ...

  6. css滚动条样式自定义

    很简单的几行代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  7. css滚动条样式

    1.横向滚动条:(abeamScroll) <div style="width:400px;height:200px;overflow-x:auto;overflow-y:hidden ...

  8. 在css中定义滚动条样式

    1,Overflow内容溢出时的设置 overflow 水平及垂直方向内容溢出时的设置 overflow-x 水平方向内容溢出时的设置 overflow-y 垂直方向内容溢出时的设置 以上三个属性设置 ...

  9. 使用css实现无滚动条滚动+使用插件自定义滚动条样式

    使用css实现无滚动条滚动,摘抄自:曹小萌博客 使用css实现无滚动条滚动,大体思路是在div外面再套一个div.这个div设置overflow:hidden.而内容div设置 overflow-x: ...

随机推荐

  1. 数组的splice方法

    splice 该方法向或者从数组中添加或者删除项目,返回被删除的项目,同时也会改变原数组. splice(index,howmany,item1,...itemX) index参数:必须,整数,规定添 ...

  2. java虚拟机规范(se8)——java虚拟机结构(二)

    2.5 运行时数据区域 java虚拟机定义了多个用于程序执行期间的运行时数据区域.这些数据区域中一些随着java虚拟机的启动而创建,随着虚拟机的退出而销毁.其他的数据区域时和线程相关的.线程相关数据区 ...

  3. 用Executors工具类创建线程池

    多线程技术主要解决处理器单元内多个线程执行的问题,它可以显著减少处理器单元的闲置时间,增加处理器单元的吞吐能力. 线程池主要用来解决线程生命周期开销问题和资源不足问题.通过对多个任务重用线程,线程创建 ...

  4. wpf 千位符 格式化字符串

    StringFormat={}{0:N2}}//格式话字符串,增加千位符,2保留小数点后2位 StringFormat={}{0:N0}}//格式话字符串,增加千位符,无小数点后

  5. AngularJs(SPA)单页面SEO以及百度统计应用（下）

    苍苍之天不得久视,堂堂之地不得久履 当你小心翼翼的开启服务端渲染的同时,一个问题不得不注意,使用内存模式去保存渲染过的页面,这样服务断掉重启后,缓存也没有了,所以这里我们使用mongdodb进行本地化 ...

  6. Kosaraju算法学习

    Kosaraju 算法学习 序 这星期捣鼓了一个新的算法--Kosaraju算法 今天分享给大家 简介 Kosaraju算法,其实与tarjan算法差不多.但是码量较小,容易记忆.其时间复杂度与tar ...

  7. centos 监控进程，并自动重启

    编辑Crontab crontab -e 按i进行编辑 */ * * * * /root/monitor.sh # 每分钟运行一遍monitor.sh脚本 * * * /sbin/reboot # 每 ...

  8. UEFI启动

    uefi是一种更快捷快速的电脑启动配置,它的全称是“统一可扩展固件接口”(Unified Extensible Firmware Interface) 要详细了解uefi之前,我们不得不从bios说起 ...

  9. 应用Mongoose开发MongoDB（2）模型（models）

    数据模型及基础操作模板 为了使工程结构清晰,将数据模型(Schema, Model)的建立与增删查改的基础操作模板写在一起,命名为数据库设计中的Collection(对应于关系型数据库中的表定义)名, ...

  10. python 实现远端ftp文件上传下载

    python 实现ftp上传下载 * 脚本需要传入两个参数,参数1为需要从远端ftp站点下载文件名称,参数2为已知需要下载的文件md5值,文件下载完成后会自动进行md5值校验 * 运行示例 [root ...