在學(xué)習(xí)前端過程中，很多學(xué)員都會把visibility和display混為一談，其實在高手看來，visibility和display的差別還是很大的，那么，什么是visibility和display屬性？visibility和display的區(qū)別有哪些？

一：什么是visibility和display屬性

1.visibility是用來設(shè)置元素是隱藏的還是顯示的，visible就表示顯示，而hidden就表示隱藏，當(dāng)我們把visibility屬性設(shè)置成hidden，表示該元素是隱藏的，但是隱藏的位置還是保留的，其實的文字不會移動。

用法和解釋：

visibility: visible
/* 元素可見，默認(rèn)值*/
visibility: hidden
/* 元素不可見，但仍然為其保留相應(yīng)的空間*/
visibility: collapse
/* 只對 table 對象起作用，能移除行或列但不會影響表格的布局。如果這個值用在 table 以外的對象上則表現(xiàn)為 hidden 。*/
visibility: inherit
/* 繼承上級元素的 visibility 值。*/

2.display是隱藏之后，對浮動的一種設(shè)置。

用法和解釋:

display: none
/* 元素不可見，并且不為其保留相應(yīng)的位置*/
display: block
/* 表現(xiàn)為一個塊級元素（一般情況下獨(dú)占一行）*/
display: inline
/* 表現(xiàn)為一個行級元素（一般情況下不獨(dú)占一行）*/

二：visibility和display的區(qū)別有哪些

1.用法不同

visibility的用法是有四個值，經(jīng)常用到的就是隱藏和顯示，而display 屬性的值有很多，但是我們只關(guān)注幾個值，block、none 和 inline。

2.隱藏的空間

visibility在原空間會保留， display中的none會把元素從頁面上刪除，并且在頁面上看不到元素是否存在。

三：如何使用visibility和display元素

如果你想隱藏元素，并且要求在頁面上保留元素空間的話，就可以使用visibility： hidden，如果你想隱藏并且改變布局的話就使用 display： none。

以上就是對什么是visibility和display屬性？visibility和display的區(qū)別有哪些的全部介紹，如果你想了解更多有關(guān)HTML視頻教程，請關(guān)注php中文網(wǎng)。

以上就是什么是visibility和display屬性？visibility和display的區(qū)別有哪些的詳細(xì)內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！