全寬HTML5視頻問題

Question

我正在尋找一種方法來製作全寬HTML5視頻（但不是全高）。

像背景覆蓋的CSS圖像會讓我做的事情。

實施例：

http://photohack.rs.af.cm

凡標題下方的圖像條將與全寬視頻背景來替換。

寬度100％，設置高度不起作用，因爲視頻是自動縮放的，而不是全寬。

謝謝！

Answer 1

在大多數情況下，它是一個簡單的修復。

video { 
    max-width: 640px /* cannot exceed this width */ 
    max-height: 390px /* cannot exceed this height */ 
    width: 100% /* 640px or less depending on size of viewport */ 
    height: auto /* automatically calculates height from via above values */ 
} 

總是！處理全寬視頻，響應式設計和移動時總是使用百分比。唯一可以使用像素的時間是定義max-height和max-width屬性時。