viewport-fit - CSS（层叠样式表） 编辑

草案
本页尚未完工.

这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

viewport-fit CSS @viewport  descriptor 是为了控制文档是如何填充满屏幕的。

语法

/* 关键值*/
viewport-fit: auto;
viewport-fit: contain;
viewport-fit: cover;

属性值

auto

此值不影响初始布局视图端口，并且整个web页面都是可查看的。

contain

视图端口按比例缩放，以适合显示内嵌的最大矩形。

cover

视图端口被缩放以填充设备显示。强烈建议使用 safe area inset 变量，以确保重要内容不会出现在显示之外。

形式语法

<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">

注意

在使用 viewport-fit 描述符时，必须记住并不是所有的设备显示都是矩形的，因此应该使用safe area inset 变量。

规范

另请参见

• env()