建站资讯
2016-06-07 00:36:13
浏览:
让我们来看看另一个在今天的网站中非常重要的媒体——视频。由于大多数网站使用的视频来自第三方网站,我决定把重点放在 Nick La 的弹性视频技术,这种技术可让您嵌入的响应式的视频。
HTML:
1
2
3
|
|
CSS:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
.video-container { position : relative ; padding-bottom : 56.25% ; padding-top : 30px ; height : 0 ; overflow : hidden ; } .video-container iframe, .video-container object, .video-container embed { position : absolute ; top : 0 ; left : 0 ; width : 100% ; height : 100% ; } |
在你的网站上应用了这些代码后,嵌入的视频也是响应式(Responsive)的了。