我想制作一個簡單的動畫來顯示和隱藏一個組件。

#parent {
  height: 0px;
}

<div id="parent">
  <div id="child">This is some content</div>
</div>

向父對象添加溢出隱藏屬性。這樣溢出的內容就被剪切掉了，其余的內容就看不見了(在主題案例中，height是0，所以剩余的內容也是0)。

#parent {
  height: 0px;
  overflow: hidden;
}

添加溢出:隱藏子DOM中寫的任何東西，它都將消失

#parent {
  height: 0px;
  overflow: hidden;
}

<div id="parent">
  <div id="child">
    This is some content..
    This is some content..
    This is some content..
  </div>
</div>

我知道這是一個老帖子，但我也有同樣的問題，其他解決方案不起作用。我的問題很簡單。我需要在我想要折疊的元素中設置填充為0，然后它按照我的要求消失了。