使用 <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文件 ...
随机推荐
- spring中集成hibernate
1.hibernate框架是什么? (1)hibernate对jdbc进行的封装 (2)开源的轻量级框架. 2.hibernate思想:ORM(对象关系映射) (1)让实体类和数据库中的表一一对应(表 ...
- [Basics] 递归
Recursion就是方法调用自己,递归其实和循环是非常像的,循环都可以改写成递归,递归未必能改写成循环,这是一个充分不必要的条件.
- C++ DWORD 转byte char 数组、指针
C++ DWORD 转byte char 数组.指针 byte byteData[1024]; // byte数组,示例 DWORD dwData = dwReadBytes; // dword数据, ...
- javascript高级
数组及操作方法 数组就是一组数据的集合,javascript中,数组里面的数据可以是不同类型的. 定义数组的方法 //对象的实例创建 var aList = new Array(1,2,3); //直 ...
- 8、TypeScript-解构赋值
1.数组的解构赋值 2.对象的解构赋值 注意:在浏览器环境中,windows本身有一个成员name,所以要重新,语法为 属性名:重命名 3.函数的解构赋值
- Node.js知识点总结
1. 回调函数 当程序跑起来时,一般情况下,应用程序(application program)会时常通过API调用库里所预先备好的函数.但是有些库函数(library function)却要求应用先传 ...
- 免费赠送原创的opengl电子书教程和案例源码
免费赠送原创的opengl电子书和案例源码,有兴趣qq群 52391108 下面是一部分教程截图
- Python3列表(list)比较操作教程
一.相等比较 1.1 同顺序列表比较 顺序相同直接用“==”进行比较即可 list1 = ["one","two","three"] lis ...
- idea怎么创建properties文件
我们在idea当中新建一个properties时,就要新建一个ResourceBundle类型的文件
- 在Postman中使用不受信任的SSL证书
阅读目录 第一种方案——临时添加到受信任的证书颁发机构: 第二种方案——永久添加到受信任的证书颁发机构: add by zhj: 在http://www.cnblogs.com/ajianbeyour ...