设置滚动条样式_CSS

设置滚动条样式

/*滚动条样式*/
::-webkit-scrollbar-track-piece {
  background-color: #FFF
}

::-webkit-scrollbar-thumb {

  background-color: #c2c2c2;
  background-clip: padding-box;
  min-height: 28px
}
::-webkit-scrollbar-thumb:hover {
  background-color: #A0A0A0
}

如果不加滚动条样式，则

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

但是该方法对手机端不起作用，求大神支招！

如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！

思路：一个外层盒子设置背景；一个内层盒子设置宽高背景，并设置animate让盒子移动demo:css部分：@keyframes mymove { from{l... [阅读全文]

translate(-50%,-50%) 属性：向上和左，移动自身长宽的 50%，使其居于中心位置。与使用margin实现居中不同的是，margin必须知道自身... [阅读全文]

效果实现html先准备一个干净的 html 页面，写好节点：<!doctype html><html lang="en"&... [阅读全文]

方法：以实际项目中less为例：.lk-toolbar { .el-input { width: 169px; margin-... [阅读全文]

绝对定位方法：（1）将父元素设置为相对定位，不写父元素的高度时，会随着左边的子元素高度变化而变化.parent {/*关键代码*/position: relat... [阅读全文]

解决方案在父元素中加入position:relative;子元素中加入position:absolute; right:20px;代码html结构<div... [阅读全文]

一、多次调用单箭头实现了单箭头–就很容易实现双箭头了，上文已经介绍2种实现单箭头的原理：边框旋转方式、双三角覆盖方式。这次以边框旋转为例多次调用实... [阅读全文]

inline-flex 和 inline-block 一样，对内部元素来说是个 display:flex 的容器，对外部元素来说是个 inline 的块。两者的... [阅读全文]

一、起因：子盒子设置浮动之后效果：由此可见，蓝色的盒子设置浮动之后，因为脱离了标准文档流，它撑不起父盒子的高度，导致父盒子高度塌陷。如果网页中出现了这种问题... [阅读全文]

废话不多说帖代码html部分<div class="positionleft">我是position方式的左边，占30%<... [阅读全文]


验证码：

验证码：

设置滚动条样式