在開發(fā)HTML頁(yè)面時(shí),我們常常需要使用到div元素來排版。但是有時(shí)候需要隱藏某個(gè)div元素,卻又不希望影響其他元素的排版布局。這個(gè)時(shí)候,我們就可以使用設(shè)置div占位隱藏的方法。
div.hidden { position: absolute; left: -9999px; height: 0; width: 0; }
以上代碼中,我們?cè)O(shè)置了一個(gè)名為“hidden”的class,將要隱藏的div元素添加這個(gè)class即可實(shí)現(xiàn)占位隱藏的效果。具體實(shí)現(xiàn)原理是將該元素的left屬性設(shè)為負(fù)數(shù),把元素推到屏幕之外,同時(shí)將其高度和寬度都設(shè)為0,不會(huì)對(duì)其他元素的位置布局產(chǎn)生影響。
需要注意的是,使用這種方法時(shí),元素雖然不可見,但仍然存在于DOM樹中,仍然會(huì)占用網(wǎng)絡(luò)資源,可能會(huì)影響頁(yè)面加載速度。如果需要完全刪除元素,建議使用Javascript來操作DOM,動(dòng)態(tài)刪除元素。