Html5的video標籤自動填充滿父div的大小

想要video能自動填充慢父div的大小，只要給video標籤加上style="width:100%; height:100%; object-fit:fill"便可。

object-fit語法

object-fit屬性的語法很是的簡單：

object-fit:fill | contain | cover | none | scale-down

object-fit取值說明

object-fit主要適合於替換元素，好比：<video>、<object>、<img>、<input type="image">、<svg>、<svg:image>和<svg:video>等。其默認值爲fill。object-fill取值的說明以下：

 fill:此值爲boject-fit的默認值，替換內容的大小被設置爲填充元素的內容框，也就是說，元素的內容擴大到徹底填充容器的外形尺寸，即便這打破其內在的寬高比。
 contain：替換元素內容大小保持長寬比例填充元素內容容器，其具體對象大小被解析爲一個包含元素的寬度和高度。也就是說，若是你在替換元素上設置一個明確的高度和寬度，此值將致使內容大小，徹底在固定的比例顯示，但仍在元素尺寸內顯示。
 cover：替換元素內容大小保持長寬比例填充元素內容容器，其具體對象大小被解析爲覆蓋整個元素的寬度和高度。也就是說，替換元素內容大小保持長寬比，但改變寬度和高度，以便徹底覆蓋內容元素。
 none：替換元素內容不調整大小以適應內部元素的容器，內容徹底忽略設置在元素上的任何高度和權重，而且仍在元素尺寸內顯示。
 scale-down：當內容大小設置了non或contain，將致使具體對象變得更小。

————————————————
版權聲明：本文爲CSDN博主「yoyo_wu1986」的原創文章，遵循 CC 4.0 BY-SA 版權協議，轉載請附上原文出處連接及本聲明。
原文連接：https://blog.csdn.net/wuqingyou_w/article/details/51671356