Bootstrap

css强制显示滚动条

多运用于横向需要滚动的情况,如果不显示滚动条 给人感觉像是页面内容加载不全

<div className={style.tableWrap}>
	<div>滚动的内容</div>
</div>
.tableWrap {
  overflow-y: hidden;
  overflow-x: scroll;
  padding-bottom: 0.05rem;
}
.tableWrap::-webkit-scrollbar {
 -webkit-appearance: none;
 }
 .tableWrap::-webkit-scrollbar:vertical {
   width: 1.4rem;
 }
 .tableWrap::-webkit-scrollbar:horizontal {
   height: 0.06rem;
 }
 .tableWrap::-webkit-scrollbar-thumb {
   // border: 2px solid white; /* should match background, can't be transparent */
   background-color: #d8d8d8;
   border-radius: 0.03rem;
 }

效果图
在这里插入图片描述

;