HTML Object标签去除滚动条溢出

标签 html css overflow

我正在尝试应用 overflow <object/> 的属性(property)元素。这可能吗?

问题示例如下:JSFiddle .在 Chrome 中,溢出似乎被忽略了。我怎样才能解决这个问题?

HTML

<body>
    <object id="my-object" data="http://www.rfc-editor.org/rfc/rfc1.txt"></object>
</body>

CSS

#my-object {
    height : 500px;
    width : 300px;
    overflow : hidden;
}

最佳答案

数据对象,如 <object>没有溢出属性。您可以通过浏览器的检查器自行检查,转到 obj#my-object属性和寻找 overflow (它不在那里)

因此,通过将滚动条放入容器中并使父项比子项小约 20px 来隐藏滚动条。然后,您可以使用另一个与文本元素具有相同宽度和高度的元素并将其覆盖以防止滚动。总而言之,它looks like this

<body scroll="no">
    <div class='container'>
        <object id="my-object" data="http://www.rfc-editor.org/rfc/rfc1.txt">
        </object>
        <div class='preventScroll'></div>
    </div>
</body>

.container { 
    width:300px; height:500px; 
    overflow:hidden; 
    position:relative; 
}
.preventScroll { 
    width:100%; height:100%; 
    position:absolute; top:0; left:0; 
}
#my-object {
    height: 100%;
    width: 320px;
    position:relative;
}

话虽如此,我建议使用更现代的 <iframe>相反

关于HTML Object标签去除滚动条溢出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23787371/

相关文章:

jquery - 防止文本超出包含的 <div>

html - 位置绝对和溢出隐藏

html - Div 元素滚动而不是在溢出时扩展 :auto

javascript - jquery 验证检查 3 个复选框的状态均已选中,然后启用按钮

javascript - 为什么没有显示验证? PHP Codeigniter

html - Powershell将流程列表转换为HTML

html - Safari 溢出/可见性和溢出/显示错误(元素仍然可见)

html - 将文本内容添加到 div 会导致内联 block 元素被撞下

javascript - 为什么 AngularJS 不能使用多个延迟脚本?

html - float : Left with different display types