如何使用CSS实现嵌入FLASH视频自适应长宽

html-css08

如何使用CSS实现嵌入FLASH视频自适应长宽,第1张

为了嵌入并使其自适应长宽,准备了一个非常有用的CSS技巧。在我进一步之前,引入介绍这个CSS技巧。 部分CSS样式代码如下;

.video {

position: relative

padding-bottom: 56.25%

height: 0

overflow: hidden

}

.video iframe,

.video object,

.video embed {

position: absolute

top: 0

left: 0

width: 100%

height: 100%

}

1、首先打开css视频制作播放软件,进入主界面。

2、其次通过百分比设置宽度内容,根据宽高比16:9,计算出高度的百分比数值,设置内边距为高度的数值。

3、最后在点击设置找到内容放大缩小点击保真选项保存推出即可不失真。

第一步:你的这个banner,要设计成左右两端可以与页面背景相融合的那种形式。比如左右两端都用了渐变透明,看上去与整个网页的背景融合在了一起。

第二步:这个1000px的banner,在屏幕上居中显示。然后不管你的显示器分辨率多宽,它都会居中。

通过这种方式。这个1000px的banner,让人看上去不分显示器分辨率多大,都是通屏显示了。。。

没有其他的办法。除非你不在意图片变形,在网页中用一段js来取当前浏览器的实际宽度,然后用js来改变这个banner的width值。但这样图片会变形的(即便你用等比例缩放,但是放大后图片失真了)