CSS隱藏與顯示屬性較為常見的有display和visibility屬性。
/* display屬性 */ display: none; /* 隱藏元素 */ display: block; /* 元素以塊級元素方式顯示 */ display: inline; /* 元素以行內元素方式顯示 */ /* visibility屬性 */ visibility: hidden; /* 元素不可見,但還占據空間 */ visibility: visible; /* 元素可見 */
使用display屬性可以將元素完全隱藏,并不占據頁面空間。此屬性常用于控制元素的顯示和隱藏,如下:
/* HTML */ <div id="example"></div> /* CSS */ #example { display: none; }
以上代碼將會隱藏id為example的div元素,但該元素仍然存在于頁面中,不會影響頁面布局。
使用visibility屬性則可以使元素不可見,但該元素仍然占據頁面空間,不會影響其他元素的布局。下面是一個示例:
/* HTML */ <div id="example"></div> /* CSS */ #example { visibility: hidden; }
以上代碼將會使id為example的div元素不可見,但該元素仍然占據頁面空間,其他元素仍會受到該元素的影響。
綜上可知,display屬性和visibility屬性取決于元素的顯示和占據空間需求,開發者應根據具體需求選擇使用。
上一篇css隱藏二級導航菜單
下一篇css隱藏元素使用語句