[CSS] diplay:none 和 visibility:hidden的差異

最近在頁面加入權限控管時
要把div隱藏起來，並在同樣位置
發現display:none和visibility:hidden的差別


使用display:none會整個div不見，位置前移
使用visibility:hidden會dive隱藏，保留原始位置

如果用過vue.js的話，概念會類似
display:none / block  => v-if
visibility:hidden / visible => v-show

參考範例
範例