CSS RWD视频

• 

  响应式网页设计 - 视频使用width属性

  如果width属性设置为100％，则视频播放器将响应并按比例放大和缩小：

  video {
    width: 100%;
    height: auto;
  }

  尝试一下

  请注意，在上面的示例中，视频播放器可以放大到大于其原始大小。在许多情况下，更好的解决方案是使用max-width属性。

• 

  使用max-width属性

  如果max-width属性设置为100％，则视频播放器必须缩小（如果必须），但从不缩放到大于其原始大小：

  video {
    max-width: 100%;
    height: auto;
  }

  尝试一下
• 

  将视频添加到示例网页

  我们想在示例网页中添加视频。视频将调整大小以占用所有可用空间：

  video {
    width: 100%;
    height: auto;
  }

  尝试一下