2023年6月20日发(作者:)
CSS局部滚动和修改滚动条样式局部滚动和修改滚动条样式部分区域滚动/* --- 不滚动部分 --- */#box{ overflow: hidden; height: 100%;}/* --- 滚动部分 --- */.scroll-area{ -webkit-overflow-scrolling: touch; overflow-y:scroll;//overflow-x 横屏滚动 overflow-y 竖屏滚动 white-space: nowrap;}修改滚动条样式/* --- 改变滚动条样式 --- */.scroll-area::-webkit-scrollbar { width: 10px;}/* --- 滚动条⾥⾯的滚动块 --- */.scroll-area::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 5px #eee; background: #eee;}/* --- 滚动条⾥⾯轨道 --- */.scroll-area::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); border-radius: 10px; background: #FFEB3B; /* border: none; background: none; */}
2023年6月20日发(作者:)
CSS局部滚动和修改滚动条样式局部滚动和修改滚动条样式部分区域滚动/* --- 不滚动部分 --- */#box{ overflow: hidden; height: 100%;}/* --- 滚动部分 --- */.scroll-area{ -webkit-overflow-scrolling: touch; overflow-y:scroll;//overflow-x 横屏滚动 overflow-y 竖屏滚动 white-space: nowrap;}修改滚动条样式/* --- 改变滚动条样式 --- */.scroll-area::-webkit-scrollbar { width: 10px;}/* --- 滚动条⾥⾯的滚动块 --- */.scroll-area::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 5px #eee; background: #eee;}/* --- 滚动条⾥⾯轨道 --- */.scroll-area::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); border-radius: 10px; background: #FFEB3B; /* border: none; background: none; */}
发布评论