要素の表示・非表示を切り替える際のプロパティ

要素の表示・非表示を切り替える際のプロパティで、
display: none;
visibility: hidden;
opacity: 0;
これらの違いがよく分かっていません。
どのような使い分けをすればよいでしょうか？

→display:noneは要素ごと無くなる（htmlもなくなる）イメージで
visibility、opacityに関しては透明度0になり、見えなくなるイメージです。（非表示のような）なのでdisplayとそれ以外で考えていただくといいかと思います。よろしくお願いいたします。