HTML网页制作:[13]浮动框架iframe
1、浮动框架式一种比较特别的框架,和frame比较类似。不过frame必须在frameset中才可以,而iframe不一样,首先, 他是一种内联框架,其次,他可以放在网页中的任何位置。
所以,iframe可以直接放置在<body></body>中或者其他标签之中。
2、OK,来看下iframe的语法。
<iframe src="源页面"></frame>
简单吧。
当然,还有其他的一些属性:
1)width:框架的宽度
2)height:框架的高度
3)align:框架的对齐方式,左对齐left,右对齐right,居中middle,底部对齐botton.
4)scrolling:滚动条显示属性
3、上例子:
框架<br/><iframe src="2.html"></iframe>我是框架<br/>
![HTML网页制作:[13]浮动框架iframe](https://exp-picture.cdn.bcebos.com/3fe32442a07aa0101ad85c8bbfbb19efa35f3e43.jpg)
4、看网页效果图
在body中,插入了一个浮动框架,浮动框架插入的就是2.html网页
![HTML网页制作:[13]浮动框架iframe](https://exp-picture.cdn.bcebos.com/ed792abb19efa25fa7ff72c859828689a0463b43.jpg)
5、OK,我们来改变下浮动框架的高度和宽度
框架<br/><iframe src="2.html
![HTML网页制作:[13]浮动框架iframe](https://exp-picture.cdn.bcebos.com/d3c39889a146b7b15f12cf0ec77c34b33d413543.jpg)
6、看网页效果,他的高度和宽度都被我改变了。
![HTML网页制作:[13]浮动框架iframe](https://exp-picture.cdn.bcebos.com/4d3d2ab33c4133ba64aab3ce6a37c97623bc2f43.jpg)
7、再来试着改变他的对齐方式。
框架<br/><iframe src="2.html
![HTML网页制作:[13]浮动框架iframe](https://exp-picture.cdn.bcebos.com/e076d77622bc7dc5728c9bec5e460596b9142943.jpg)
8、网页效果如下,其已经变成了右对齐了
![HTML网页制作:[13]浮动框架iframe](https://exp-picture.cdn.bcebos.com/2a1ecb460596b814363b05b043d246fe464e2243.jpg)
9、当然,还有其他更多的属性,这里只介绍了一些简单的。
嗯,后面我会写上如何给iframe和frame添加链接的目录架构。
就是点击目录,然后在一个框架中显示不同的内容。
请关注我后续关于网页的经验吧。我会写的越来越高端的。
![HTML网页制作:[13]浮动框架iframe](https://exp-picture.cdn.bcebos.com/f591ab03c8d246fe81a57230b8bf3bef344f1e43.jpg)
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
阅读量:67
阅读量:123
阅读量:46
阅读量:119
阅读量:50