使用 <embed> 标签显示 flash文件(swf)格式 ,如何设置 width 和 height 宽度,高度.
1. embed 标签 支持 .swf 格式. .flv 的不支持.
2. 通常情况下, 网站中上传 多个 flash文件. 它的默认大小是不一样的. 而且 可以 宽度 大于 高度(横向的) ; 宽度 小于 高度 (竖向的) .
此时. 最好的的办法 是给 <embed> 设置 一个 固定的 宽度 和高度 .
此时flash 会自动缩放. 至于缩放比例: 如果 先 碰到 高度 , 那么 flash的高度就是 embed的 设置的高度, 宽度等比例缩放;
如果 先碰到宽度, 那么flash的宽度 就是 embed 设置的宽度, 高度等比例缩放.
------------------------------------------------------------------------------------
以下是例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>emebedtest</title>
<style type="text/css"> .box {
width: 1000px;
border: 1px solid black;
margin: 20px auto; } </style>
</head>
<body>
<h2 style="text-align: center;">横向</h2>
<div class="box">
<embed src="./flash5516/flash5516.swf" type="" style="border: 1px solid red;">
</div> <div class="box">
<embed src="./flash5516/flash5516.swf" type="" style="border: 1px solid red; width: 800px;">
</div> <div class="box">
<embed src="./flash5516/flash5516.swf" type="" style="border: 1px solid red; width: 800px; margin: 0px auto;">
</div> <div class="box">
<embed src="./flash5516/flash5516.swf" type="" style="border: 1px solid red; width: 800px; height: 600px; margin: 0px auto;">
</div> <div class="box">
<embed src="./flash5516/flash5516.swf" type="" style="border: 1px solid red; width: 800px; height: 600px; margin-left: calc( (100% - 800px)/2 )">
</div> <div class="box">
<embed src="./flash5516/flash5516.swf" type="" style="border: 1px solid red; width: 100%; ">
</div> <hr>
<h2 style="text-align: center;">竖向</h2>
<div class="box">
<embed src="./flash5408/flash5408.swf" type="" style="border: 1px solid red;">
</div> <div class="box">
<embed src="./flash5408/flash5408.swf" type="" style="border: 1px solid red; width: 800px;">
</div> <div class="box">
<embed src="./flash5408/flash5408.swf" type="" style="border: 1px solid red; width: 800px; margin: 0px auto;">
</div> <div class="box">
<embed src="./flash5408/flash5408.swf" type="" style="border: 1px solid red; width: 800px; height: 600px; margin: 0px auto;">
</div> <div class="box">
<embed src="./flash5408/flash5408.swf" type="" style="border: 1px solid red; width: 800px; height: 600px; margin-left: calc( (100% - 800px)/2 )">
</div> <div class="box">
<embed src="./flash5408/flash5408.swf" type="" style="border: 1px solid red; width: 100%; ">
</div> </body>
</html>
<embed src="./flash5408/flash5408.swf" type="" style="border: 1px solid red; width: 800px; height: 600px; margin-left: calc( (100% - 800px)/2 )">
对于 标签 <embed>
width: 800px; height: 600px; 是设置一固定的宽度 和 高度 .
margin-left: calc( (100% - 800px)/2 )
是 让 <embed> 在 父级 div.box 中 水平居中显示. 而垂直居中是不需要的. 因为 div.box 的 高度 就是 由 <embed>撑起来的(600px)
-------------------------------------------------------------------------
网页显示:
横向:


---------------------------
竖向:


使用 <embed> 标签显示 flash文件(swf)格式 ,如何设置 width 和 height 宽度,高度.的更多相关文章
- 解决embed标签显示在div上层【转藏】
解决embed标签显示在div上层,非设置z-index 今天给屌炸了爆笑网增加了视频栏目,但是发现在IE8中,顶部浮动导航的div在移动到embed视频上时,总是被embed的flash文件盖住.分 ...
- 转: object 和embed 标签播放flash
一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和 EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBE ...
- embed标签的flash层级太高问题
因为客户要求,项目得兼容IE的兼容模式 页面到了flash都会遮挡底部悬浮的导航. 改变浮动窗口和embed的层级还是不可以.应该不是层级的关系. 最后百度解决方案:在embed标签内添加了wmode ...
- img标签显示本地文件
html: <img src="__IMG__/male.png" id="imgfpic1" style="height: 100%; wid ...
- 2018.11.10 Mac设置Eclipse的 .m2文件夹是否可见操作&&Mac系统显示当前文件夹的路径设置
第一行就是设置为可见的记得要重启Finder不然是没有效果的 第二行就是设置为不可见的 打开"终端"(应用程序->实用工具),输入以下两条命令: defaults write ...
- Android开发遇到的问题:不给include设置width、height,导致ListView GridView内容无法显示
我的目的是做一个带有TextView的ListView列表页面. 以下是这个页面的xml: <?xml version="1.0" encoding="utf-8& ...
- MVC应用程序显示Flash(swf)视频
前段时间, Insus.NET有实现<MVC使用Flash来显示图片>http://www.cnblogs.com/insus/p/3598941.html 在演示中,它也可以显示Flas ...
- embed标签的使用(在网页中播放各种音频视频的插件的使用)
播放器插件使用说明: 代码:< EMBED src=“music.mid”autostart=“true”loop=“2”width=“80”height=“30”> src:音乐文件的路 ...
- 利用FlashPaper在web页面中显示PDF文件(兼容各浏览器)
应项目需求要把PDF内嵌到网页中显示,其中有了很多办法,比如用<embed/>元素放入PDF文件,但是效果不理想,浏览器兼容不理想,在ie9/8(其他版本没有测试)显示会提示下载pdf文件 ...
随机推荐
- English Voice of <<Way Back Into Love>>
I have been living with a shadow overhead我一直生活在阴影中I have been sleeping with a cloud above my bed睡梦中床 ...
- mybatis多参数传递,延迟加载,缓存,注解开发
1.Mybatis的多参数传递方式 需求:更具id 和 名字查询用户: select * from user where id = ? and name = ?: 1):QueryVo 或者 User ...
- discuss!X3.4 帖子显示昵称而不是用户名的解决办法
问题:dedecmsV5.7和discuz!X3.4整合之后,实现免激活登陆之后,从dede过来的用户在discuz 直接展示的用户名,因为我们的用户名是手机号,所以不想帖子都展示的是用户名. 因为我 ...
- 八大排序算法详解(动图演示 思路分析 实例代码java 复杂度分析 适用场景)
一.分类 1.内部排序和外部排序 内部排序:待排序记录存放在计算机随机存储器中(说简单点,就是内存)进行的排序过程. 外部排序:待排序记录的数量很大,以致于内存不能一次容纳全部记录,所以在排序过程中需 ...
- idea springboot jrebel hotreloaded
http://127.0.0.1:8888/88414687-3b91-4286-89ba-2dc813b107ce
- linux下sort命令详解
1 sort的工作原理 sort将文件的每一行作为一个单位,相互比较,比较原则是从首字符向后,依次按ASCII码值进行比较,最后将他们按升序输出. [rocrocket@rocrocket progr ...
- JS(JAVASCRIPT)
2018-08-17 * JAVASCRIPT(JavaScript简写js,文件的后缀名也是 demo.js)(*****) * javascript的简介 * js是基于对象和事件驱动的脚本语言, ...
- java-面向对象(公元2017-6-28)
1.面向对象 何为面向对象:编写程序的时候会提取相似的 特征,把这些相似的特征组织起来 类:相似的特征组织起来的类型. 泛指.可理解为模板 对象:属于类中的具体事物 ...
- 【Alpha】测试报告
测试中发现的Bug 测试伴随着前后端的首次连接之后与开发一起进行,在本阶段,我们遇到了各种各样的bug,有些体现在功能上,有些虽然不会影响到具体的功能实现,但是会影响到用户体验.由于时间问题,我们对其 ...
- 决策树(ID3、C4.5、CART)
ID3决策树 ID3决策树分类的根据是样本集分类前后的信息增益. 假设我们有一个样本集,里面每个样本都有自己的分类结果. 而信息熵可以理解为:“样本集中分类结果的平均不确定性”,俗称信息的纯度. 即熵 ...