css控制元素隱藏和顯示

Hello~~各位小夥伴,今天我們廣州藍景實訓部,繼續和大家分享前端技術乾貨,CSS隱藏元素

總結出7種隱藏元素的辦法

1.CSS display的值是none。(該元素是不會在頁面上顯示的)

div{     display: none; }

2. type="hidden"的表單元素。(該元素是不會在頁面上顯示的)

3. 寬度和高度都顯式設定為0。(該元素會在頁面上顯示)

div{     width: 0;     height: 0; }

4. 一個祖先元素是隱藏的,(該祖先以及祖先以下的元素是不會在頁面上顯示)

5. CSS visibility的值是hidden(該元素是會在頁面上顯示,還佔原來的位置)

div{     visibility: hidden; }

6. CSS opacity的指數是0(該元素是會在頁面上顯示,還佔原來的位置)

div{     opacity: 0; }

7. 將position設為absolute然後將位置設到不可見區域

div{    position: absolute;    top: -9999px;    left: -9999px; }

想要了解更多web前端開發技術資料,可在評論區留言!也可新增我們微信:philip_tan