display和visibility的屬性

2021-10-12 19:04:13 字數 577 閱讀 4620

display屬性設定元素的顯示方式,對應指令碼特性為display,可選值為none、block和inline,各值的說明如下: 

none 隱藏元素,不保留元素顯示時的空間。 

block塊方式顯示元素。 

inline 以內嵌方式顯示元素。 

visibility屬性設定是否顯示元素,對應的指令碼特性為visibility,可選值為inherit、hidden和visible,各值的說明如下: 

inherit 繼承父元素的visibility屬性設定。 

hidden 隱藏元素,但保留其所佔空間。 

visible 顯示元素(預設值)。 

使用的時候的說明:

display:none;時隱藏該html元素,確切的說,是在瀏覽器中消除該元素,不佔螢幕的空間。若其下有其他元素,就會上移到該空間區域。 

dispaly:block;顯示已經隱藏的html元素,如果別的元素占有了該空間時,他將下移,空間重新別原來的元素占有。 

visibility:hidden;隱藏該元素,真正的隱藏,但他還占有那塊空間。 

visibility:visible;讓元素顯示. 

visibility和display的區別和用法

div的visibility可以控制div的顯示和隱藏,但是隱藏後頁面顯示空白 style visibility none document.getelementbyid typediv1 style.visibility hidden 隱藏 document.getelementbyid type...

display的block和inline屬性

block元素特點 1.處於常規流中時,如果width沒有設定,會自動填充滿父容器 2.可以應用margin padding 3.在沒有設定高度的情況下會擴充套件高度以包含常規流中的子元素 4.處於常規流中時布局時在前後元素位置之間 獨佔乙個水平空間 5.忽略vertical align inlin...

display和visibility的用法和區別

大多數人很容易將css屬性display和visibility混淆,它們看似沒有什麼不同,其實它們的差別卻是很大的。visibility和display兩個屬性都有隱藏元素的功能。visibility屬性所控制的元素雖然不在瀏覽器裡面顯示出來,但他在瀏覽區里是存在的,只是不顯示而已。而display...