Vmin 是 CSS3 中的一個新單位,它是基于視口寬度(Viewport Width)和視口高度(Viewport Height)之間的較小值來計算的。
一般情況下,瀏覽器窗口的大小是由視口寬度和視口高度共同決定的。因此,使用 vmin 單位可以確保元素在不同的設備上顯示的大小相對穩定,能夠適應各種屏幕的大小。
/* 使用 vmin 單位定義元素寬度 */ .box { width: 50vmin; }
在上面的樣式中,元素的寬度將根據視口的寬度和高度中的較小值來計算,因此它將在不同設備上顯示出相同的大小。
不過需要注意的是,Vmin 僅在支持 CSS3 的瀏覽器才能使用,而對于一些舊版本的瀏覽器來說,則需要使用其他的兼容方案來替代使用。
/* 設置 fallback 方案 */ .box { width: 50%; width: 50vmin; }
在這個例子中,如果瀏覽器不支持 vmin 單位,則會使用百分比來計算元素的寬度。
上一篇vue css 漸變
下一篇val函數css