用CSS隱藏頁面元素的5種方法

2021-10-08 08:47:59 字數 392 閱讀 1766

1.opacity

設定乙個元素的透明度只是從視覺上隱藏元素,對頁面布局還是有影響,讀屏軟體會原樣讀出

2.visibility

設定為hidden將隱藏我們的元素,對網頁布局還是起作用,子元素也會被隱藏,單獨設定子元素可見是生效的,讀屏軟體不會讀取

3.display

設定為none,相當於元素完全不存在,對頁面布局不起作用,子元素也會被隱藏,單獨設定子元素可見不生效,讀屏軟體也不會讀取

4.position

假設有乙個元素你要與它互動,但又不讓它影響網頁布局,可以考慮將元素移出可視區域,如.hide

讀屏軟體會讀取

5.clip-pathd(ie和opera全不支援)

裁剪實現隱藏元素,對頁面布局有影響,讀屏軟體會讀取

用 CSS 隱藏頁面元素的 5 種方法

opacity屬性的意思是設定乙個元素的透明度。它不是為改變元素的邊界框 bounding box 而設計的。這意味著將 opacity 設為 0 只能從視覺上隱藏元素。而元素本身依然佔據它自己的位置並對網頁的布局起作用。它也將響應使用者互動。hide第二個要說的屬性是visibility。將它的值...

用 CSS 隱藏頁面元素的 5 種方法

用 css 隱藏頁面元素的 5 種方法 opacity opacity 屬性的意思是設定乙個元素的透明度。這意味著將 opacity 設為 0 只能從視覺上隱藏元素,而元素本身依然佔據它自己的位置並對網頁的布局起作用,同時它將響應使用者互動。此外,元素在讀屏軟體中不會被隱藏。visibility 將...

用 CSS 隱藏頁面元素

用 css 隱藏頁面元素有許多種方法。你可以將 opacity 設為 0 將 visibility 設為 hidden 將 display 設為 none 將 position 設為 absolute 然後將位置設到不可見區域。opacity,佔據網頁布局,可以互動,讀屏軟體可以讀到它 opacit...