iframe的宽度大于屏幕宽度

最新推荐文章于 2022-05-26 19:37:24 发布

原创最新推荐文章于 2022-05-26 19:37:24 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue

web前端专栏收录该内容

419 篇文章

订阅专栏

本文详细介绍了如何通过HTML与CSS结合使用，实现Iframe中滚动条的隐藏，并确保其在不同设备上都能保持良好的响应式布局效果。

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

<div style="overflow: auto;-webkit-overflow-scrolling:touch;width:100%;height:100%;">
        <iframe src="https://engine.tuishark.com/index/activity?appKey=46F2nawUGq9KB1gCeHBZzxn1jyGp&adslotId=256909"
            frameborder="0" height="100%" scrolling='no' style="width: 1px; min-width: 100%; *width: 100%;"></iframe>
    </div>



//第一步：定义 iframe 中的scrolling属性为no，设置iframe中不显示滚动条。

<iframe  scrolling="no" ></iframe>
//第二步：设置iframe的样式为如下所示
<style>
iframe{
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    min-width: 100%;
    *width:100%;
    width:1px;
}
 
</style>