分类目录 共计收录12891站; 资讯文章53103篇; 待审网站 4455站; 当月收录0站; 今日审核0站; 已收到106个打赏!
分类目录快审
软文外链发布
原创文章撰写
 
快审详情
首页 > 教程收藏 > CSS教程

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

为了嵌入FLASH视频并使其自适应长宽,我们为所有开发人员准备了一个非常有用的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%;
}

如何应用到模板?

把上面的CSS放到模板的主CSS里面,比如CSS最后!

然后后台发布视频编辑器里HTML部分为

<p class="video"><iframe src="http://player.youku.com/embed/XOTI3MjU1MTIw" frameborder="0" allowfullscreen=""></iframe></p>

这样就可以了!

版权免责声明: 1、本站内容均来源于网络,请自行鉴定真假 2、如有侵权,违法,恶意广告,虚假欺骗行为等 以上问题联系站长删除

此文由 at-lib网站目录 编辑,未经允许不得转载!: