Question

无聊时，我喜欢在浏览器上制作简单的javascript游戏，最近我遇到了一个我不知道该如何解决的问题。我制作的所有游戏都有两个基本基础。
1. 容器 div
2. 平台 div
容器 div覆盖了整个屏幕，而平台 div仅位于容器 div的顶部。因此，对另一个用户来说，背景看起来像是某种颜色（例如青色），中间有一张白纸。我使用的代码可以总结为以下代码所示：

<html>
  <head>
    <style>
    * { margin:0; padding:0;}
    .container {background: cyan; width: 100%; height: 100%;}
    .platform {background: white; width: 80%; height: 80%; position: absolute; bottom: 50%; right: 50%; transform: translate(50%,50%);}
    </style>
  </head>
  <body>
    <div class="container">
      <div class="platform"></div>
    </div>
  </body>
</html>

一切正常，直到我在网页开头使用代码。容器消失了。我试图通过在容器div内（就在平台div之前）编写“ Hello World”来检查会发生什么，它的作用是，它显示带有青色背景的文本，其宽度从左到右扩展边缘。但是其余的仍然没有被我想要的容器填满。

我的主要问题是：

1.为什么会发生？

2.以及如何通过使用html文件中的代码来实现所需的功能？即我应该对代码进行哪些更改，以便获得与不编写代码时相同的输出？

先谢谢您！

<！DOCTYPE html>更改我的html文件的外观

0 个答案: