iframe滚动条样式美化

 分类:html知识时间:2022-02-12点击:

iframe滚动条frame嵌入页面后,我们有时需要调整滚动条,例如,去掉全部的滚动条,去掉右边的滚动条且保留底下的滚动条,去掉底下的滚动条且保留右边的滚动条。iframe滚动条样式美化,iframe 有一个scrolling属性,它有 auto , yes , no 这三个值。

iframe滚动条样式美化

<iframe src="url"></iframe>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>iframe</title>
<style type="text/css">
.iframe {
width:900px;
height: 600px;
}
</style>
</head>
<body>
<iframe class="iframe" frameborder="0" scrolling="auto" allow="fullscreen" src="url"></iframe>
</body>
</html>

iframe滚动条样式美化,iframe 有一个scrolling属性,它有 auto , yes , no 这三个值。

     scrolling : auto -----在需要的时候滚动条出现

      scrolling : yes ------始终显示滚动条

      scrolling : no -------始终隐藏滚动条

       当设置   scrolling : no 时,全部的滚动条就没有了。

iframe常用属性:

 1.frameborder:是否显示边框,1(yes),0(no)

 2.height:框架作为一个普通元素的高度,建议在使用css设置。

 3.width:框架作为一个普通元素的宽度,建议使用css设置。 

4.name:框架的名称,window.frames[name]时专用的属性。 

5.scrolling:框架的是否滚动。yes,no,auto。 

6.src:内框架的地址,可以使页面地址,也可以是图片的地址。 

7.srcdoc , 用来替代原来HTML body里面的内容。但是IE不支持, 不过也没什么卵用 

8.sandbox: 对iframe进行一些列限制,IE10+支持。

除注明外的文章,均为来源:老汤博客,转载请保留本文地址!
原文地址: