display和visibility在css中有什么區(qū)別

display和visibility在css中有什么區(qū)別？針對(duì)這個(gè)問(wèn)題，這篇文章詳細(xì)介紹了相對(duì)應(yīng)的分析和解答，希望可以幫助更多想解決這個(gè)問(wèn)題的小伙伴找到更簡(jiǎn)單易行的方法。

Display的屬性值
 
block：
/*表現(xiàn)為一個(gè)塊級(jí)元素（一般情況下獨(dú)占一行）*/
當(dāng)display被設(shè)置為block(塊)時(shí)，容器中所有的元素將會(huì)被當(dāng)作一個(gè)單獨(dú)的塊，就像<DIV>元素一樣，它會(huì)在那個(gè)點(diǎn)被放入到頁(yè)面中。(實(shí)際上你可以設(shè)置<span>的display:block，使其可以像<DIV>一樣工作。
inline:
/*表現(xiàn)為一個(gè)行級(jí)元素（一般情況下不獨(dú)占一行）*/

將display設(shè)置為inline，將使其行為和元素inline一樣---即使它是普通的塊元素如<DIV>，它也將會(huì)被組合成像<span>那樣的輸出流。
none:
/*元素不可見，并且不為其保留相應(yīng)的位置*/
最后是display被設(shè)置：none,這時(shí)元素實(shí)際上就從頁(yè)面中被移走，它下面所在的元素就會(huì)被自動(dòng)跟上填充。
 
visibility的屬性值

visibility:visible
/*元素可見，默認(rèn)值*/

visibility:hidden
/*元素不可見，但仍然為其保留相應(yīng)的空間*/

visibility:collapse
/*只對(duì)table對(duì)象起作用，能移除行或列但不會(huì)影響表格的布局。如果這個(gè)值用在table以外的對(duì)象上則表現(xiàn)為hidden。*/

visibility:inherit
/*繼承上級(jí)元素的visibility值。*/
 
Visibility:none 和 Display:hidden 的區(qū)別

display:none;
使用該屬性后，HTML元素（對(duì)象）的寬度、高度等各種屬性值都將“丟失”;
visibility:hidden;
使用該屬性后，HTML元素（對(duì)象）僅僅是在視覺上看不見（完全透明），而它所占據(jù)的空間位置仍然存在，也即是說(shuō)它仍具有高度、寬度等屬性值。

關(guān)于display和visibility在css中有什么區(qū)別問(wèn)題的解答就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，如果你還有很多疑惑沒(méi)有解開，可以關(guān)注億速云行業(yè)資訊頻道了解更多相關(guān)知識(shí)。