建站资讯

如果让嵌入的视频实现响应式

2016-06-07 00:36:13

浏览:

让我们来看看另一个在今天的网站中非常重要的媒体视频。由于大多数网站使用的视频来自第三方网站,我决定把重点放在 Nick La 的弹性视频技术,这种技术可让您嵌入的响应式的视频

让我们来看看另一个在今天的网站中非常重要的媒体——视频。由于大多数网站使用的视频来自第三方网站,我决定把重点放在 Nick La 的弹性视频技术,这种技术可让您嵌入的响应式的视频。

  HTML:

1
2
3
class="video-container">
    

  

  CSS:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
.video-container {
    positionrelative;
    padding-bottom56.25%;
    padding-top30px;
    height0;
    overflowhidden;
}
 
.video-container iframe, 
.video-container object, 
.video-container embed {
    positionabsolute;
    top0;
    left0;
    width100%;
    height100%;
}

  在你的网站上应用了这些代码后,嵌入的视频也是响应式(Responsive)的了。

作者: admin
如果让嵌入的视频实现响应式
让我们来看看另一个在今天的网站中非常重要的媒体视频。由于大多数网站使用的视频来自第三方网站,我决定把重点放在 Nick La 的弹性视频技术,这种技术可让您嵌入的响应式的视频
长按图片保存/分享

深圳网站设计公司

启邦互动,深圳网站建设制作开发公司,擅长网站建设制作,欧美网站建设,外贸网站建设,国外网站建设。针对客户的预算提供不同的外贸网站解决方案

联系方式

深圳市龙岗区吉华街道水径综合楼6c-1

Call us : + 137 2425 9054

Email us : service@sz-qibang.com

在线咨询

您好,请点击在线客服进行在线沟通!

联系方式
热线电话
17727976231
上班时间
周一到周五
E-mail地址
service@sz-qibang.com
扫一扫二维码
二维码
扫码咨询
添加微信好友,详细了解产品
使用企业微信
“扫一扫”加入群聊
复制成功
添加微信好友,详细了解产品
我知道了