css object-fit: cover;屬性保持原有尺寸比例縮放,但部分內容可能被剪切。


object-fit 屬性指定元素的內容應該如何去適應指定容器的高度與寬度。

object-fit 一般用於 img 和 video 標簽,一般可以對這些元素進行保留原始比例的剪切、縮放或者直接進行拉伸等。

object-fit: fill|contain|cover|scale-down|none|initial|inherit;

fill:默認,不保證保持原有的比例,內容拉伸填充整個內容容器。
contain:保持原有尺寸比例。內容被縮放。
cover:保持原有尺寸比例。但部分內容可能被剪切。
none:保留原有元素內容的長度和寬度,也就是說內容不會被重置。
scale-down:保持原有尺寸比例。內容的尺寸與 none 或 contain 中的一個相同,取決於它們兩個之間誰得到的對象尺寸會更小一些。 »
initial:設置為默認值,關於 initial
inherit:從該元素的父元素繼承屬性。 關於 inherit


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM