首頁 >web前端 >前端問答 >bootstrap自備的隱藏類別有哪些

bootstrap自備的隱藏類別有哪些

青灯夜游
青灯夜游原創
2022-01-10 11:04:532524瀏覽

bootstrap自帶的隱藏類別有:「.hidden」、「.visible-xs-*」、「.visible-sm-*」、「.visible-md-*」、「.visible- lg-*」、「.hidden-xs」、「.hidden-sm」等等。

bootstrap自備的隱藏類別有哪些

本教學操作環境:Windows7系統、bootsrap3.3.7版、DELL G3電腦

Bootstrap 提供了一些輔助類,以便更快地實現對行動裝置友善的開發。這些可以透過媒體查詢結合大型、小型和中型設備,實現內容對設備的顯示和隱藏。

需要謹慎使用這些工具,避免在同一個網站建立完全不同的版本。響應式實用工具目前只適用於區塊和表格切換。

類別 描述
#.show 強制元素顯示
.hidden 強制元素隱藏
超小螢幕            手機 (<768px)小螢幕            平板 (≥768px)#中螢幕 桌面(≥1200px).visible-xs-*可見#隱藏隱藏.visible-sm-*#隱藏##隱藏隱藏.visible-md-*隱藏#可見#隱藏.visible-lg-*#隱藏#隱藏##可見##.hidden-xs隱藏#可見可見可見光.hidden-sm可見隱藏#可見# #.hidden-md可見





           桌面 (≥992px)#大螢幕
##可見
##隱藏

可見

隱藏#可見.hidden-lg可見可見可見隱藏類別組CSS display
#從v3.2.0 版本起,形如.visible-*-* 的類別針對每種螢幕大小都有了三種變體,每個針對CSS 中不同的display 屬性,列表如下:

.visible-*-block

display: block;

####.visible-*-inline######display: inline;############.visible-*-inline-block######display: inline-block;###############因此,以超小螢幕(xs)為例,可用的.visible-*-* 類別是:.visible-xs-block、. visible-xs-inline 和.visible-xs-inline-block。 ######.visible-xs、.visible-sm、.visible-md 和 .visible-lg 類別也同時存在。但從 v3.2.0 版本開始不再建議使用。除了 相關的元素的特殊情況外,它們與 .visible-*-block 大致相同。 ######更多關於bootstrap的相關知識,可訪問:###bootstrap基礎教程###! ! ###

以上是bootstrap自備的隱藏類別有哪些的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn