相同：
1、兩者都能隱藏元素。
不同：
1、display:none 不占頁面空間，visiblity:hidden 占據原先頁面空間。
這里必須說明的是，元素不占頁面空間后，取該元素或其內部元素的寬高值永遠是0。如果想隱藏又想取到寬高值，那就得用visiblity:hidden。
2、display:none 的子元素也一定無法顯示，visiblity:hidden 的子元素可以設置顯示。
display:none元素及其子元素都將隱藏，而visiblity:hidden元素的子元素卻可以設置visibility: visible 顯示出來。在這一點上，如果頁面是比較復雜或者是不受控制的，就要慎重使用visiblity:hidden，因為保不齊哪個元素被設置成可見，影響顯示效果。
3、display:none 引起頁面重繪和回流， visiblity:hidden 只引起頁面重繪。
visiblity:hidden 看起來的性能比display:none好些，在兩者都能使用情況下，可先考慮visiblity:hidden。但也不用千方百計用visiblity:hidden，用哪個還是看需求，性能優化只是其中一部分，莫要本末倒置。