900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > JS 横向纵向滚动条

JS 横向纵向滚动条

时间:2021-12-17 22:03:22

相关推荐

JS 横向纵向滚动条

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>homework</title><style>/*监控滚动条*/.tv{overflow-x: auto;overflow-y: hidden;color: #000;height: 365px;width: 1250px;font-size: .7rem;font-family: "\5FAE\8F6F\96C5\9ED1",Helvetica,"黑体",Arial,Tahoma;}/*滚动条样式*/.tv::-webkit-scrollbar {/*滚动条整体样式*/width: 4px;/*高宽分别对应横竖滚动条的尺寸*/height: 4px;}.tv::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 5px;-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);background: rgba(0,0,0,0.2);}.tv::-webkit-scrollbar-track {/*滚动条里面轨道*/-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);border-radius: 0;background: rgba(0,0,0,0.1);}.img{width: 618px;height: 363px;float: left;position: relative;display: inline-block;}</style></head><body><div class="tv" style="margin-top: 10px;">//也需要固定大小<div style="width: 12250px">//要比上一级大<img class="img" src="a.png">//需要固定大小<img class="img" src="a.png"><img class="img" src="a.png"><img class="img" src="a.png"><img class="img" src="a.png"><img class="img" src="a.png"></div></div></body></html>

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