300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > element-ui table 滚动条样式修改

element-ui table 滚动条样式修改

时间:2023-02-15 21:24:22

相关推荐

element-ui table 滚动条样式修改

先看效果:

思路:使用 css 样式修改滚动条

<!-- 局部样式修改 element-table --><style>/* 整体样式 */.el-table__body-wrapper::-webkit-scrollbar {width: 8px;height: 8px;}/* 滚动条 */.el-table__body-wrapper::-webkit-scrollbar-thumb {background-color: #b3d8ff;border-radius: 6px;}/* 滚动条鼠标经过样式 */.el-table__body-wrapper::-webkit-scrollbar-thumb:hover {background-color: #66b1ff;border-radius: 8px;}/* 滚动条轨道 */.el-table__body-wrapper::-webkit-scrollbar-track-piece {-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);border-radius: 10px;background: #ededed}</style><!-- 全局样式修改 --><style type="text/css">::-webkit-scrollbar {width: 8px;height: 8px;}::-webkit-scrollbar-thumb {background-color: #b3d8ff;border-radius: 6px;}::-webkit-scrollbar-thumb:hover {background-color: #66b1ff;border-radius: 8px;}::-webkit-scrollbar-track-piece {-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);border-radius: 10px;background: #ededed}</style>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。