- ·上一篇内容:HTML十六进制颜色
- ·下一篇内容:HTML form表单
HTML iframe框架
在HTML中,框架用于在一个网页中嵌入另外一个网页的内容。
HTML 框架定义方式
在HTML中使用 <iframe> 标签来定义一个框架,其基本格式如下:
<iframe src="url"></iframe>
src属性用于给出内嵌的网页地址。网页地址可以是绝对地址或相对地址。
下面是一个例子:
<h1>iframe框架网页的例子</h1>
<iframe src="/other/example-6590.html"></iframe>
其显示效果如下:
指定框架的宽度和高度
上面的例子是默认情况下的显示效果,在实际中为了较好的显示iframe中网页的内容,可以使用width属性和height属性指定iframe的宽度和高度。
<iframe src="/other/example-6590.html" width="600" height="480"></iframe>
宽度和高度默认单位是像素。我们也可以使用iframe的style属性来设置width和height的值。
<iframe src="/other/example-6590.html" style="width:600px;height:480px;"></iframe>
设置iframe的边框
我们根据实际情况可以设置iframe的边框。
移除边框
可以使用iframe的frameborder属性或style属性将iframe的边框移除掉。
下面的例子通过将frameborder的值设置为0来实现移除边框的效果。
<iframe src="/other/example-6590.html" frameborder="0"></iframe>
下面的例子使用style属性移除iframe的边框。
<iframe src="/other/example-6590.html" style="border:none;"></iframe>
设置iframe边框的粗细和颜色
我们可以使用style属性来设置边框的粗细和颜色。
<iframe src="/other/example-6590.html" style="border:2px solid blue;"></iframe>
上例中,将iframe的边框设置为2个像素的宽度,实线,蓝色。其效果显示如下:
使用iframe作为链接的目的框架
我们可以使用iframe来作为其它链接的目的框架,即通过设置链接的target属性使打开的网页在iframe中进行显示。
此时,需要为iframe指定name属性,并让链接target的值为name属性的值即可。
下面的例子演示了这种用法。
<p>
<a href="/other/example-6596.html" target="myiframe">无序列表</a> |
<a href="/other/example-6599.html" target="myiframe">HTML颜色</a>
</p>
<iframe src="/other/example-6604.html" name="myiframe" style="width:600px; height:480px;"></iframe>
本文的所有例子可以点击这里预览效果。
微信搜索“优雅的代码”关注本站的公众号,或直接使用微信扫描下面二维码关注本站公众号,以获取最新内容。
个人成长离不开各位的关注,你的关注就是我继续前行的动力。