zoukankan      html  css  js  c++  java
  • 自定义滚动条样式

    /*滚动条全局样式  ------- 如只是莫一指定的滚动条 可以带上它的id class等*/
    ::-webkit-scrollbar {
    10px;//表示垂直滚动条的宽度
    height: 10px;//表示水平滚动条的高度
    }
    /*正常情况下滑块的样式*/
    .sys_module_conten::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,.05);
    border-radius: 4px;
    -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
    }
    /*鼠标悬浮在该类指向的控件上时滑块的样式*/
    ::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,.2);
    border-radius: 4px;
    -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
    }
    /*鼠标悬浮在滑块上时滑块的样式*/
    ::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0,0,0,.4);
    -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
    }

    /*正常时候的主干轨道部分*/
    ::-webkit-scrollbar-track {
    border-radius: 4px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
    background-color: white;
    }
    /*鼠标悬浮在滚动条上的主干轨道部分*/
    ::-webkit-scrollbar-track:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.4);
    background-color: rgba(0,0,0,.01);
    }
  • 相关阅读:
    0302思考并回答一些问题
    0104 自下而上
    1203 有穷自动机的构造
    11 10我的评论
    1029 C语言文法翻译(2)
    1014 对编译程序的心得与总结
    我们小组的编译程序
    0921 词法分析程序
    0909 关于编译原理的思考
    数据库设计之数据库设计三大范式
  • 原文地址:https://www.cnblogs.com/lihong-123/p/9752924.html
Copyright © 2011-2022 走看看