每集博客 HTML5基础教程学习-7嵌入元素
嵌入元素：
主要功能是把外部的一些资源插入到HTML中。
一、都哪些元素属于嵌入元素。
img，嵌入图片
map，定义客户端分区响应图
area，表示一个用户客户端分区响应图的区域
audio，表示一个音频资源
video，表示一个视频资源
iframe，嵌入一个文档
embed，用插件在HTML中嵌入内容
canvas，生成一个动态的图形画布
meter,嵌入数值在许可值范围背景中的图形表示
object，在HTML文档中嵌入内容
param，表示将通过object元素传递给插件的参数
progress，嵌入目标进展或任务完成情况的图形表示
source，表示媒体资源
svg，表示结构化矢量内容
track，表示媒体的附加轨道，例如字幕
二、这里只讲解一部分嵌入元素的应用，只要大家能明白嵌入元素的含义就好。
1、<img src=”img.jpg”>
嵌入外部图片，src后面就是图片的路径。
img有属于它自己的私有属性：
src，嵌入图像的url
alt,图片无法加载时显示的替换文本
width，定义图片的宽度
height，定义图片的高度
ismap，创建服务器端分区响应图
usemap，关联<map>元素，
2、<map>创建分区响应图
其实就是热点图，也就是在一个图片的某个位置画出一个小的区域作为锚点添加超链接，我们点击后就跳到目标网页。我们在Dreamweaver里可以直接设置，这里就不用代码讲了，很麻烦的。
3、iframe 嵌入一个HTML文档，也就是框架。
<a href=”http://www.ql2015.cn” target=”come”>每集博客</a>|
<a href=”http://www.mageo.cn” target=”come”>每集官网</a>
<br />
<iframe src=”http://www.baidu.com” frameborder=”1〃 width=”700px” height=”500px” name=”come”>
</iframe>
这段代码的意思就是让上面的两个超级链接的页面显示到下面的框架里，框架命名name=”come”，而上面两个链接的打开方式target值就是come，也就做到了在框架里显示页面。而默认的框架里的网页内容是百度首页。
如图所示：
4、<embed>嵌入插件内容
<embed>元素是扩展浏览器功能的，大部分用于添加对插件的支持。比如插入一个视频网站的flash视频。
<embed src=”” type=””></embed>
src是文件路径，type表示被插入内容的类型。一般一些视频网站提供的全兼容模式的视频代码就是这样的格式。
5、<object>和<param>元素
<object>元素和<embed>一样，只不过object是html4的标准，而embed是html5的标准。object不但可以嵌入flash，还可以嵌入图片等其他内容。今天这里只讲解html5所以关于object就不过说介绍了，况且他也已经被弱化了，不常用了。
6、<progress>显示进度
<progress value=”40〃 max=”80〃></progress>
<progress>元素可以显示一个进度条，一般通过js控制内部的值，IE9以及以下低版本不支持。
7、<meter>显示范围里的值
<meter value=”80〃 min=”10〃 max=”120〃 low=”40〃 high=”80〃 optimum=”60〃></meter>
<meter>元素显示某个范围内的值。他的属性包含：min和max表示范围边界，low表示小于它的值过低，High表示大于它的值过高，optimum表示最佳值，但不出现效果。ie不支持此元素。
本教程原创作者:mageo，出自每集博客，尊重作者劳动，转载请注明出处：http://www.ql2015.cn，谢谢！
嵌入元素：
主要功能是把外部的一些资源插入到HTML中。
一、都哪些元素属于嵌入元素。
img，嵌入图片
map，定义客户端分区响应图
area，表示一个用户客户端分区响应图的区域
audio，表示一个音频资源
video，表示一个视频资源
iframe，嵌入一个文档
embed，用插件在HTML中嵌入内容
canvas，生成一个动态的图形画布
meter,嵌入数值在许可值范围背景中的图形表示
object，在HTML文档中嵌入内容
param，表示将通过object元素传递给插件的参数
progress，嵌入目标进展或任务完成情况的图形表示
source，表示媒体资源
svg，表示结构化矢量内容
track，表示媒体的附加轨道，例如字幕
二、这里只讲解一部分嵌入元素的应用，只要大家能明白嵌入元素的含义就好。
1、<img src=”img.jpg”>
嵌入外部图片，src后面就是图片的路径。
img有属于它自己的私有属性：
src，嵌入图像的url
alt,图片无法加载时显示的替换文本
width，定义图片的宽度
height，定义图片的高度
ismap，创建服务器端分区响应图
usemap，关联<map>元素，
2、<map>创建分区响应图
其实就是热点图，也就是在一个图片的某个位置画出一个小的区域作为锚点添加超链接，我们点击后就跳到目标网页。我们在Dreamweaver里可以直接设置，这里就不用代码讲了，很麻烦的。
3、iframe 嵌入一个HTML文档，也就是框架。
<a href=”http://www.ql2015.cn” target=”come”>每集博客</a>|
<a href=”http://www.mageo.cn” target=”come”>每集官网</a>
<br />
<iframe src=”http://www.baidu.com” frameborder=”1〃 width=”700px” height=”500px” name=”come”>
</iframe>
这段代码的意思就是让上面的两个超级链接的页面显示到下面的框架里，框架命名name=”come”，而上面两个链接的打开方式target值就是come，也就做到了在框架里显示页面。而默认的框架里的网页内容是百度首页。
如图所示：
4、<embed>嵌入插件内容
<embed>元素是扩展浏览器功能的，大部分用于添加对插件的支持。比如插入一个视频网站的flash视频。
<embed src=”” type=””></embed>
src是文件路径，type表示被插入内容的类型。一般一些视频网站提供的全兼容模式的视频代码就是这样的格式。
5、<object>和<param>元素
<object>元素和<embed>一样，只不过object是html4的标准，而embed是html5的标准。object不但可以嵌入flash，还可以嵌入图片等其他内容。今天这里只讲解html5所以关于object就不过说介绍了，况且他也已经被弱化了，不常用了。
6、<progress>显示进度
<progress value=”40〃 max=”80〃></progress>
<progress>元素可以显示一个进度条，一般通过js控制内部的值，IE9以及以下低版本不支持。
7、<meter>显示范围里的值
<meter value=”80〃 min=”10〃 max=”120〃 low=”40〃 high=”80〃 optimum=”60〃></meter>
<meter>元素显示某个范围内的值。他的属性包含：min和max表示范围边界，low表示小于它的值过低，High表示大于它的值过高，optimum表示最佳值，但不出现效果。ie不支持此元素。
本教程原创作者:mageo，出自每集博客，尊重作者劳动，转载请注明出处：http://www.ql2015.cn，谢谢！
