开发者社区> 问答> 正文

CSS 隐藏元素的几种方法(至少说出三种)

CSS 隐藏元素的几种方法(至少说出三种)

展开
收起
茶什i 2019-11-18 14:33:58 1551 0
2 条回答
写回答
取消 提交回答
  • 下一站是幸福

    display:none 设置元素的display为none是最常用的隐藏元素的方法。

    visibility:hidden 设置元素的visibility为hidden也是一种常用的隐藏元素的方法,和display:none的区别在于,元素在页面消失后,其占据的空间依旧会保留着,所以它只会导致浏览器重绘而不会重排。

    opacity:0 opacity属性我相信大家都知道表示元素的透明度,而将元素的透明度设置为0后,在我们用户眼中,元素也是隐藏的,这算是一种隐藏元素的方法。

    2020-03-26 22:30:26
    赞同 展开评论 打赏
  • Opacity:元素本身依然占据它自己的位置并对网页的布局起作用。它也将响应用户交互;

    Visibility:与 opacity 唯一不同的是它不会响应任何用户交互。此外,元素在读屏软件中也会被隐藏;

    Display:display 设为 none 任何对该元素直接打用户交互操作都不可能生效。此外,读屏软件也不会读到元素的内容。这种方式产生的效果就像元素完全不存在;

    Position:不会影响布局,能让元素保持可以操作;

    Clip-path:clip-path 属性还没有在 IE 或者 Edge 下被完全支持。如果要在你的 clip-path 中使用外部的 SVG 文件,浏览器支持度还要低;

    2019-11-18 14:34:09
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
零基础CSS入门教程 立即下载
低代码开发师(初级)实战教程 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载