css实现内部滚动

最新推荐文章于 2025-06-22 16:44:49 发布

花生地瓜

最新推荐文章于 2025-06-22 16:44:49 发布

阅读量4k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/u013018357/article/details/51862269

本文详细介绍了如何使用CSS实现元素内部的滚动效果，包括如何设置overflow属性、调整scrollbar样式以及实现无缝滚动的动态效果。通过实例代码和步骤解析，帮助读者掌握这一实用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html页面
<div class="container">
  <figure class="figcaption">
    <img src="/minimg/index5.jpg" class="img-full" />
 </figure>
 <p class="text-p">这是一张测试图片</p>
</div>

css样式
.container{
    max-width: 64rem;
    margin: 0 auto;
}
.figcaption{
    width: 100%;
    height: 8rem;
    overflow: hidden;
    overflow-y: visible;
}
.text-p{
    height: 20rem;
    line-height: 20rem;
    text-align: center;
    width: 100%;
    background: deepskyblue;
}