我想在小屏幕上以全宽和全高显示对话框。这似乎有效。但是，当我尝试在较大的屏幕中删除宽度和高度（通过使用未设置、自动或初始）时，它不起作用。有办法做到吗？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
dialog {
width: 100dvw;
height: 100dvh;
}
@media (min-width: 700px) {
dialog {
width: unset;
height: unset;
}
}
</style>
</head>
<body>
<dialog open>Hello!</dialog>
</body>
</html>使用
revertunsetauto根据 spec 对话框的宽度和高度应设置为
fit-contentrevertdialog {
position: absolute;
inset-inline-start: 0; inset-inline-end: 0;
width: fit-content;
height: fit-content;
margin: auto;
border: solid;
padding: 1em;
background-color: Canvas;
color: CanvasText;
}