在CSS規則中,我們經常需要控制圖層的顯示和隱藏。其中,讓某個圖層不顯示的方法是通過設置CSS的display屬性來實現。
div{ display: none; }
上面的代碼表示,將所有div圖層的display屬性設置為none。這樣,在頁面加載時,這些div圖層就不會顯示出來。
需要注意的是,如果設置了一個圖層的display屬性為none,那么該圖層及其子元素都將不會顯示出來。如果需要顯示子元素,則需要對子元素進行逐一設置。
div.child{ display: block; /*或者其他合適的display屬性*/ }
上面的代碼表示,將class為child的div圖層的display屬性設置為block(或者其他合適的display屬性),使其子元素能夠顯示出來。
另外,如果需要在某個時刻讓不顯示的圖層再次顯示,只需要將其display屬性設置為其他合適的值即可。
div.hidden{ display: none; }JS代碼:
var div = document.getElementsByClassName('hidden')[0]; //獲取class為hidden的div圖層 div.style.display = 'block'; //將其display屬性設置為block,使其顯示出來
總之,通過設置CSS的display屬性,我們能夠方便地控制圖層的顯示和隱藏,實現頁面的動態效果。
上一篇css控制字符間隔
下一篇css提示信息透明層