ブートストラップスウェールとは何ですか?

ウェル: スタイルの効果は、大画面表示の Jumbotron スタイルに似ています。違いは、ウェル スタイルには境界線の設定があり、デフォルトの高さがアダプティブ テキストの高さであることです。

サンプルコード:

<div class="well">   <p> sorry I have no word to say</p>   <blockquote>this is a 引用内容</blockquote></div>

これは、ブラウザーのビューポート全体に拡張して、Web サイト上の主要なコンテンツを表示できる軽量で柔軟なコンポーネントです。この記事では、Bootstrap swale について詳しく紹介します

概要

ウェル スタイルの効果はジャンボトロン スタイルと似ています。違いは、ウェル スタイルには境界線の設定があることと、デフォルトの高さが の高さであることです。アダプティブテキスト。要素上で Well を使用すると、簡単なインセット効果を得ることができます

Well スタイルの使用方法は非常に簡単で、.well クラスを使用するだけです

.well {min-height: 20px;padding: 19px;margin-bottom: 20px;background-color: #f5f5f5;border: 1px solid #e3e3e3;border-radius: 4px;-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}

8959d1adff1d7f51c3fc375ca8f02fc5小火柴的蓝色理想16b28748ea4df4d9c2150843fecfba68

Size

Well スタイルはさまざまな機能を提供しますサイズ スタイル (主にパディング サイズとフィレット サイズ) はそれぞれ、well-lg と Well-sm です。使用するときは、同じ要素に直接適用するだけです

.well-lg {padding: 24px;border-radius: 6px;
}.well-sm {padding: 9px;border-radius: 3px;
}

8959d1adff1d7f51c3fc375ca8f02fc5小火柴的蓝色理想16b28748ea4df4d9c2150843fecfba6805411e6872591ef99e276db56077d8a6小火柴的蓝色理想16b28748ea4df4d9c2150843fecfba68ea5496650c8431bb8e65aec523da32fe小火柴的蓝色理想16b28748ea4df4d9c2150843fecfba68

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