zoukankan      html  css  js  c++  java
  • 设置滚动条

    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;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>
  • 相关阅读:
    ArrayList removeRange方法分析
    LinkedHashMap源码分析(基于JDK1.6)
    LinkedList原码分析(基于JDK1.6)
    TreeMap源码分析——深入分析(基于JDK1.6)
    51NOD 2072 装箱问题 背包问题 01 背包 DP 动态规划
    51 NOD 1049 最大子段和 动态规划 模板 板子 DP
    51NOD 1006 最长公共子序列 Lcs 动态规划 DP 模板题 板子
    8月20日 训练日记
    CodeForces
    CodeForces
  • 原文地址:https://www.cnblogs.com/su1637/p/8287174.html
Copyright © 2011-2022 走看看