zoukankan      html  css  js  c++  java
  • CSS 隐藏容器元素的滚动条(且保持滚动事件的正常响应)

    /* less */
    .container {
      &::-webkit-scrollbar {
        display: none;
      }
    
      scrollbar- none;
    }

    1. 针对webkit内核的浏览器可使用:

    ::-webkit-scrollbar {
      display: none;  
    }

    来实现隐藏滚动条。

    注:此特性是非标准的!

    MDN:https://developer.mozilla.org/zh-CN/docs/Web/CSS/::-webkit-scrollbar

    2. CSS Scrollbars(处于实验阶段的功能特性),主要有两个属性可用 :

      scrollbar-width

      scrollbar-color

    .container {
        scrollbar-width: none;
    }

    设置scrollbar-width为none来隐藏滚动条,不过目前貌似只有firefox的较高版本中支持。

    MDN:https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Scrollbars

  • 相关阅读:
    最后一周作业
    第十四,十五周作业
    第七周作业
    第六周作业
    第四周作业
    第三周作业
    第二周作业
    二学期第三次作业
    二学期第二次作业
    二学期第一次作业
  • 原文地址:https://www.cnblogs.com/fanqshun/p/15662427.html
Copyright © 2011-2022 走看看