iframe框架和雪碧图

一、iframe标签——在当前页面显示多个网页

     1、iframe元素会创建包含另外一个文档的内联框架。

     2、iframe的属性：

          滚动条scolling="yes/no/auto"

          frameBoder="0（无）/1(默认)/正整数"

          src=“相对地址”

          width/height一个iframe元素的大小

          name=“a标签的target值”//为了跳转

    3、举例

         

            

4、iframe的优缺点

  优点

        解决加载缓慢的第三方内容图标和广告等的加载问题。

        iframe无刷新新文件上传。

        iframe跨域通信

   缺点

           iframe会阻塞主页面的onload事件。

           无法被一些搜索引擎索引到。

           页面会增加服务器的http请求。

            会产生很多页面，不容易管理。

          

二、雪碧图（sprites）

   1、雪碧图原理

        首先，把网页中的一些背景图（多个小图标）整合到一张大图片文件中；//只有背景图才可以

        再利用background-image、background-position属性对大图定位。

   2、举例

     如，淘宝首页，侧边栏的小图标，就是用雪碧图展示的。

  3、雪碧图的优点

      很好的减少了网页的http请求次数，从而加快页面加载速度，防止加载图片时出现的空白问题。（主要特点）

      通过整合， 能减少图片的字节。

      解决了命名的困难，只需要对这张大图命名。

以上是我的小小总结，如有不对的点，望大家指正！！！！