css一些兼容问题

1、下拉框样式
/*清除ie的默认选择框样式清除,隐藏下拉箭头*/
select::-ms-expand { display: none; }


//清除火狐和谷歌下的默认下拉三角,加上自己想要的背景图片
select{
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-progress-appearance: none;
    appearance: none;
    border: 1px solid #ddd;
    background:#fff url("../../public/img/droDown-mark01.svg" ) no-repeat 97.5% center;
    background-size: 12px;
}

2、滚动条样式(自定义)

/*自定义滚动条*/
.navDiv::-webkit-scrollbar-track-piece{
	background-color:transparent;
}
::-webkit-scrollbar-track-piece{
	background-color:#fff;
}
::-webkit-scrollbar{ 
width:6px;/*滚动条的宽度*/ 
height:6px;/*滚动条的高度*/ 
} 
::-webkit-scrollbar-thumb{/*滚动条的样式*//* height:50px; *//* background-color:#c8c8c8; *//* -webkit-border-radius:4px; *//* border:2px solid; *//* border-color:rgba(255,255,255,0.1); */} 
::-webkit-scrollbar-thumb:hover{/*滚动条的hover样式*/ 
height:50px; 
background-color:rgba(164,164,164,1); 
-webkit-border-radius:4px; 
}
.navDiv::-webkit-scrollbar-thumb{/*滚动条的样式*/ 
height:50px; 
background-color:rgba(228,228,228,0.7); 
-webkit-border-radius:4px; 
border:2px solid;
border-color:rgba(255,255,255,0.1);
} 
.navDiv::-webkit-scrollbar-thumb:hover{/*滚动条的hover样式*/ 
height:50px; 
background-color:rgba(228,228,228,1); 
-webkit-border-radius:4px; 
}


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值