我无法去env()上班。
* {
padding: 0;
margin: 0;
}
.testclass {
background-color: green;
padding-bottom: env(safe-area-inset-bottom);
}Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="initial-scale=1, viewport-fit=cover" />
<title>Document</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="testclass">Hello there</div>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
它看起来是这样的:
添加填充可以按padding-bottom: 50px预期工作:
我在这里做错了什么?
编辑:我想通了大部分问题(参见答案),但将网站添加到主屏幕时仍然无法正常工作。也许这和Webpack有关。