bootstrap框架辅助类二

来源：互联网 2023-02-21 18:08:56 版权归原作者所有，如有侵权，请联系我们

情境文本颜色，情境背景色，关闭按钮，三角符号，快速浮动，让内容块居中，清除浮动，显示或隐藏内容，屏幕阅读器和键盘导航，图片替换。

bootstrap框架辅助类二

工具/原料

让内容块居中

为任意元素设置 display: block 属性并通过 margin 属性让其中的内容居中。下面列出的类还可以作为 mixin 使用

bootstrap框架辅助类二

清除浮动

通过为父元素添加 .clearfix 类可以很容易地清除浮动（float）。这里所使用的是 Nicolas Gallagher 创造的 micro clearfix 方式。此类还可以作为 mixin 使用。

bootstrap框架辅助类二

显示或隐藏内容

.show 和 .hidden 类可以强制任意元素显示或隐藏(对于屏幕阅读器也能起效)。这些类通过 !important 来避免 CSS 样式优先级问题，就像 quick floats 一样的做法。注意，这些类只对块级元素起作用，另外，还可以作为 mixin 使用。

.hide 类仍然可用，但是它不能对屏幕阅读器起作用，并且从 v3.0.1 版本开始就不建议使用了。请使用 .hidden 或 .sr-only 。

bootstrap框架辅助类二

3此文章未经授权抓取自百度经验

.invisible 类可以被用来仅仅影响元素的可见性，也就是所，元素的 display 属性不被改变，并且这个元素仍然能够影响文档流的排布。

bootstrap框架辅助类二

屏幕阅读器和键盘导航

.sr-only 类可以对屏幕阅读器以外的设备隐藏内容。.sr-only 和 .sr-only-focusable 联合使用的话可以在元素有焦点的时候再次显示出来（例如，使用键盘导航的用户）。对于遵循可访问性的最佳实践很有必要。这个类也可以作为 mixin 使用。

bootstrap框架辅助类二

图片替换

使用 .text-hide 类或对应的 mixin 可以用来将元素的文本内容替换为一张背景图。

bootstrap框架辅助类二

以上方法由办公区教程网编辑摘抄自百度经验可供大家参考！