表示の違い:なしと可視性:隠し

displayプロパティは、要素の表示動作を指定するのに役立ちます.
display:noneとvisibility:hiddenの間の違い
両方のプロパティを使用して要素を隠すことができますが、それらの間に違いがあります.
赤、緑、青の3つのボールがあるとしましょう.

CSSコード
私が表示を設定するならば:緑のボールのための何もない.

#green {
  background-color:green;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  display: none;
}

今、私たちの緑のボールが削除されますが、それはまだHTMLの構造とdisplay:noneプロパティに存在する削除されるようになります.青いボールが動き、緑のボールの場所を取った.

我々が同じ緑のボールのためにvisibility:hiddenをセットしたとき、何が起こるかについて見ましょう.

#green {
  background-color:green;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  visibility: hidden;
}

visbility:hiddenプロパティは緑色のボールを削除しない、それが見えないようになります