ブートストラップソース・旅行-less-wells.less

ブートストラップは、効果にも挿入要素を使用して、視覚的に埋め込むことのようです。
そのスタイルのコードを見てください：

//
// Wells
// --------------------------------------------------


// Base class
.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: @well-bg;
  border: 1px solid @well-border;
  border-radius: @border-radius-base;
  .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
  blockquote {
    border-color: #ddd;
    border-color: rgba(0,0,0,.15);
  }
}

// Sizes
.well-lg {
  padding: 24px;
  border-radius: @border-radius-large;
}
.well-sm {
  padding: 9px;
  border-radius: @bordr-radius-small;
}

私は本当に簡単に見ることができます！、小さなノーマルと大：だけでなく3つのサイズがあります。これらの3つの仕様の違いはパディングとコーナー半径の大きさのみ異なり、他からのNO異なります。ここでは詳細に見て.well
、それはこのようないくつかのボーダー半径ベース@などの一般的な変数、および、そのようなよくBG @とよく国境@だけでなく、関連する変数を、使用しています。以下のように（variables.lessファイルから取得）

//== Wells
//
//##

@well-bg:                     #f5f5f5;
@well-border:                 darken(@well-bg, 7%);

また、国境のほか、主に色の内側BLOCKQUOTEスタイルを再設定します。実際には、type.lessファイル、BLOCKQUOTEは左の境界に追加し、BLOCKQUOTE定義にいくつかの基本的なスタイルを与えています。BLOCKQUOTEはそれを読んで私たちは一緒に持っtype.less

// Blockquotes
blockquote {
  padding: (@line-height-computed / 2) @line-height-computed;
  margin: 0 0 @line-height-computed;
  font-size: @blockquote-font-size;
  border-left: 5px solid @blockquote-border-color;

  p,
  ul,
  ol {
    &:last-child {
      margin-bottom: 0;
    }
  }

  // Note: Deprecated small and .small as of v3.1.0
  // Context: https://github.com/twbs/bootstrap/issues/11660
  footer,
  small,
  .small {
    display: block;
    font-size: 80%; // back to default font-size
    line-height: @line-height-base;
    color: @blockquote-small-color;

    &:before {
      content: '\2014 \00A0'; // em dash, nbsp
    }
  }
}

ブートストラップは、グローバルなフォントサイズが14pxで設定されているフォントサイズベース、@。それ以外の場合は設定しない限り、一般的なフォントは14pxです。
行の高さ - ベース、ハイヒール行フォントサイズの割合、1.428571429 @; // 14分の20。。
@フォントサイズベース上および行の高さ - ベースラインの高@基づいて算出される行の高さ計算@、彼らは、二つの生成物であります
@ BLOCKQUOTEフォントサイズ= @フォントサイズベース* 1.25、平均ポイントのフォントよりも大きいです

だから、主に彼らが良く見えるようにいくつかのプロパティでのボックスモデルの下で設定し、ウェルまたはBLOCKQUOTEか、見下します。私は最終的には一つ一つが読みそうする必要はありません、と思います。私はそれを見て感じて覚えていないことができます！！！

私が欲しいのはブートストラップ学習ではなく、その要素の丸暗記パディング値によって、いくつかの良いデザインのアイデアです。。。ことをすることになって？？ああ、痛みああ。。

nothing_more_than

公開された54元の記事・ウォン称賛39 ・ビュー80000 +

プライベートの手紙の懸念

ブートストラップソース・旅行-less-wells.less

おすすめ