显示或隐藏内容
.show 和 .hidden 类可以强制任意元素显示或隐藏(对于屏幕阅读器也能起效)。这些类通过 !important 来避免 CSS 样式优先级问题,就像quick floats一样的做法。注意,这些类只对块级元素起作用,另外,还可以作为 mixin 使用。
.hide 类仍然可用,但是它不能对屏幕阅读器起作用,并且从 v3.0.1 版本开始就不建议使用了。请使用 .hidden 或 .sr-only 。
另外,.invisible 类可以被用来仅仅影响元素的可见性,也就是所,元素的 display 属性不被改变,并且这个元素仍然能够影响文档流的排布。
<div class="show">...</div>
<div class="hidden">...</div>
// Classes
.show {
display: block !important;
}
.hidden {
display: none !important;
visibility: hidden !important;
}
.invisible {
visibility: hidden;
}
// Usage as mixins
.element {
.show();
}
.another-element {
.hidden();
}