Skip to main content Skip to docs navigation
View on GitHub

可见性(Visibility)

使用可见性工具类来控制 HTML 元素的可见性,并且不会修改 display 属性。

使用可见性工具类可以设置 HTML 元素的 visibility (可见性)。这些工具类完全不会修改 display 属性的值,并且不影响布局(设置了 .invisible 类的页面元素仍然会占据页面上的空间 )。

Elements with the设置了 .invisible 类的页面元素,在视觉上以及对使用辅助技术/屏幕阅读器的用户来说 都是 隐藏的。

根据需要使用 .visible.invisible

<div class="visible">...</div>
<div class="invisible">...</div>
// Class
.visible {
  visibility: visible !important;
}
.invisible {
  visibility: hidden !important;
}

Sass

工具类 API

在工具类 API 中定义了可见性(Visibility)工具类,位于 scss/_utilities.scss 文件中。了解如何使用工具类 API。

    "visibility": (
      property: visibility,
      class: null,
      values: (
        visible: visible,
        invisible: hidden,
      )
    )