我正在學(xué)習(xí)CSS，并嘗試寫一些代碼；我有三個具有內(nèi)嵌塊和指定維度的div元素。正如所料，這三個元素緊挨著出現(xiàn)，但是當我在第三個div中插入一個子元素時，它突然向下移動了大約190個像素，為什么會這樣呢？

在子元素& quot您的文本& quot：

使用子元素:

body {
  margin: 0;
}

h1 {
  margin: 0;
}

.size {
  width: 200px;
  height: 200px;
}

.col1 {
  display: inline-block;
  background-color: powderblue;
}

.col2 {
  display: inline-block;
  background-color: red;
}

.col3 {
  display: inline-block;
  background-color: blue;
}

<div class="size col2">

</div>
<div class="size col3">

</div>

<div class="size col1">
  <span>Hello</span>
</div>