以下為scss寫法
::-webkit-scrollbar { // 寬高
width: 8px;
height: 8px;
&-track { // 定義滾動條軌道 內(nèi)陰影+圓角
border-top-right-radius: 10px;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
background: transparent;
}
&-thumb { // 定義滑塊 內(nèi)陰影+圓角
$color: rgba(0, 0, 0, 0.15);
$color-hover: rgba(8, 6, 6, 0.2);
border-radius: 4px;
background: $color;
border: 1px solid rgba(255, 255, 255, 0.4);
&:window-inactive {
background-color: $color-hover;
}
&:vertical:hover { // hover
background-color: $color-hover;
}
&:vertical:active { // window滾動
background-color: $color-hover;
}
}
}
普通css使用的話急侥,將變量$color $color-hover
替換成顏色值鸥印, 如需less寫法对雪,將$
換成@
即可乔夯,