10_滚动条效果.html 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. <style>
  8. .box{
  9. width: 200px;
  10. height: 100px;
  11. border:3px dashed black;
  12. /* overflow: hidden; */
  13. /* overflow 溢出样式处理 */
  14. /* scroll 溢出内容显示滚动条 */
  15. /* overflow: scroll; */
  16. /* overflow-x 水平方向溢出内容显示滚动条 */
  17. overflow-x: scroll;
  18. /* overflow-y 垂直方向溢出内容显示滚动条 */
  19. /* overflow-y: scroll; */
  20. }
  21. /* ::-moz-scrollbale{} */
  22. /* 隐藏滚动条 */
  23. .box::-webkit-scrollbar{
  24. display: none;
  25. width: 0px;
  26. height: 0px;
  27. }
  28. p{
  29. width: 1000px;
  30. background-color: yellow;
  31. }
  32. </style>
  33. </head>
  34. <body>
  35. <div class="box">
  36. <p>
  37. 在线链接服务仅供平台体验和调试使用,平台不承诺服务的稳定性,企业客户需下载字体包自行发布使用并做好备份。
  38. </p>
  39. </div>
  40. </body>
  41. </html>