iframe+div的学习笔记

很多时候，我们想把别人的网站的功能嵌入到自己的网站上面，这样不仅节约自己写代码的时间 ，也非常简单 效率高(但是存在一些bug)
今天用到的就是iframe 和 div 

iframe是一种html标签，利用iframe可以随意的嵌套其他网站的内容，当然这个首先需要需要嵌入的页面允许你使用iframe嵌套。iframe可以指定嵌入的大小，边框等等信息。

然后利用div来指定iframe现实的区域。

因此，利用iframe和div两个标签，可以显示嵌入网站指定的某一个区域，从而避开原网站的广告和LOGO。

以下写出代码：

<div style="width:1000px;overflow:hidden;margin:0 auto;">  <div style="margin-top:-245px;">    <iframe allowTransparency="true" src="https://www.xxxxxx.com/xxx.php" height="805" width="1000" frameborder="0" scrolling="no"/>  </div></div>
代码说明：1.<div style="width:1000px;overflow:hidden;margin:0 auto;"> 这一句中比较重要的是width:1000px; 本站中所有width都是1000px，所以这一个基本不用修改，直接使用，如果你想更小，可以相应的修改小一些！2.<div style="margin-top:-245px;"> 这一句代码中 margin-top:-245px; 是指：功能区域顶部到网页顶部的距离是多少像素，这一句和后面的iframe中的height属性匹配使用，选择功能区域。3.<iframe allowTransparency="true" src="https://www.atool.org/mamabeat.php" height="805" width="1000" frameborder="0" scrolling="no"/> 这一句中height最重要，表示的意思是：功能区域底部到网页顶部距离是多少像素。4.基本的代码解释如上所示，可以大致看出一些关系：第三点中的数值 - 第二点中的数值 = 功能区域的高度。其他页面的功能，可以主要调整这两个参数来嵌入到自己网站中，同时不存在本站的广告和LOGO。