HTML不能更改Div的高度

Question

所以我在做井字游戏，但由于某些原因，我的div不会改变其高度。

html {
  background-color:black;
  color:white;
  text-align:center;
}

.cell {
  border: 1px solid white;
  margin:1px;
  width:30%;height:30%;
}

<header>Tic Tac Toe</header>
<div id='board'>
  <div class='cell'></div>
  <div class='cell'></div>
  <div class='cell'></div>
</div>

div的宽度变化很好，但是高度（应该是屏幕的30％）实际上是线条。

编辑：这可能不是必需的，但我感到很难过，如果您确实有所帮助，谢谢您抽出宝贵的时间。:)

Answer 1

那是因为您没有到板的高度，几乎0的30％是... 0。

为ID为的div添加一些高度board。

将此添加到您的CSS：

html {
  background-color:black;
  color:white;
  text-align:center;
}
#board{
 height:300px;
}
.cell {
  border: 1px solid white;
  margin:1px;
  width:30%;height:30%;
}