ホームページ > 記事 > ウェブフロントエンド > ブートストラップに付属する隠しクラスとは何ですか?

ブートストラップに付属する隠しクラスとは何ですか?

青灯夜游オリジナル: 2022-01-10 11:04:532500ブラウズ

ブートストラップに付属する非表示クラスは次のとおりです: ".hidden"、".visible-xs-*"、".visible-sm-*"、".visible-md-*"、".visible - lg-*」、「.hidden-xs」、「.hidden-sm」など。

このチュートリアルの動作環境: Windows 7 システム、ブートストラップバージョン 3.3.7、DELL G3 コンピューター

ブートストラップは、いくつかの補助クラスを提供します。高速化してモバイルフレンドリーな開発を可能にします。これらをメディアクエリを通じて大、中、小のデバイスと組み合わせて、デバイス上でコンテンツを表示したり非表示にしたりできます。

同じサイトのまったく異なるバージョンを作成しないように、これらのツールは注意して使用する必要があります。現在、リアクティブユーティリティはブロックとテーブルの切り替えでのみ機能します。

#ClassDescription.show要素の表示を強制する.hidden



#要素の非表示を強制する

##.visible-xs-*Visible非表示#表示可能非表示##.visible-md-*hiddenhiddenvisiblehidden非表示#.hidden-xshiddenvisiblevisiblevisible##.hidden-smVisibleHideVisibleVisible##.hidden-lgVisibleVisibleVisibleHide# クラスグループCSS 表示

#超小型画面携帯電話 (	小さい画面タブレット (≥768px)	中画面デスクトップ (≥992px)	大画面デスクトップ (≥1200px)
Hide	Hide	非表示		.visible-sm-*
	hidden
		#.visible-lg-*	非表示	非表示
表示可能

# #.hidden -md	Visible	Visible	Hide	Visible

バージョン v3.2.0 以降、次のようなシェイプクラスが追加されました。 .visible-- には、画面サイズごとに 3 つのバリアントがあり、それぞれ CSS の異なる表示属性をターゲットとしています。リストは次のとおりです:

.visible-*-block

表示: ブロック; .visible-*-inlinedisplay: inline;.visible-*-inline-blockdisplay: 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 とほとんど同じです。ブートストラップの詳細については、ブートストラップの基本チュートリアル

をご覧ください。！

以上がブートストラップに付属する隠しクラスとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

css bootstrap display table

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：JavaScript で next はどういう意味ですか次の記事：JavaScript で next はどういう意味ですか

続きを見る