巴中热线

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

查看: 234|回复: 0

[网页教程] 让li在同一行只出现左右滚动条,滚动条透明,移动端就可以滑动

[复制链接]
发表于 2019-9-3 00:22:45 | 显示全部楼层 |阅读模式

注册巴中热线论坛,交好友享优惠,衣食住行吃喝玩乐尽在 BZHOT.com

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
网页特效:
让li在同一行只出现左右滚动条,滚动条透明,移动端就可以滑动啦

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. ::-webkit-scrollbar {color:transparent;}
  6. #pic_list
  7. {
  8. display:block;
  9. white-space:nowrap;
  10. width:500px;
  11. overflow:auto;
  12. }
  13. #pic_list li
  14. {
  15. width:80px;
  16. height:80px;
  17. margin:3px;
  18. background:red;
  19. display:inline-block;
  20. }
  21. </style>
  22. </head>
  23. <div id="pic_list">
  24. <ul>
  25. <li></li>
  26. <li></li>
  27. <li></li>
  28. <li></li>
  29. <li></li>
  30. <li></li>
  31. </ul>
  32. </div>
  33. </body>
  34. </html>
复制代码







上一篇:html如何使网页ul中li元素文字横向排列且不换行
下一篇:如何让html特效的多个li排版居中于ul中间
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

巴中热线 - 精彩推荐上一条 /1 下一条

快速回复 返回顶部 返回列表