Bootstrap trip Fuente -Menos-wells.less

Bootstrap usando el elemento de inserción así a efecto parece visualmente para ser embebido en el.
Mira su código de estilo:

//
// 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;
}

Puedo ver realmente sencillo! así hay tres tamaños: pequeño, normal y grande. La diferencia entre estas tres especificaciones es sólo el tamaño del radio de relleno y la esquina es diferente, no es diferente de la otra. Aquí nos fijamos en detalle .bien
que utiliza algunas variables comunes, tales como @ frontera de radio-base, y las variables bien relacionados, como así @-BG y así @-frontera. En la siguiente manera (tomado del archivo variables.less)

//== Wells
//
//##

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

También re-programar el estilo blockquote interior del pozo, sobre todo el color de la frontera. De hecho, el archivo type.less, ha dado define BlockQuote algunos estilos básicos, blockquote añadido a la orilla izquierda. Nos type.less reúnen en un blockquote leyó

// 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
    }
  }
}

• @ Font-size-base, que es de rutina de carga de tamaño de fuente mundial es 14px. A menos que se establezca lo contrario la fuente general es 14px.
• @ Line-altura-base, la proporción de tamaño de tacón alto de la fuente fila, 1.428571429; // 20/14. .
• @ Computado-Line-altura se calcula basándose en el tamaño de fuente-base @ y @ line-height-base línea de alta, que son el producto de dos
• @ Blockquote-font-size = @ font-size-base * 1,25, más grande que la fuente promedio

Así que mira hacia abajo, si bien o blockquote, principalmente establecidas en el modelo de caja en algunas de las propiedades para que se vean mejor. Creo que, al final no hay ninguna necesidad de hacerlo uno por uno para leer. No puedo recordar la sensación de verla! ! !

Lo que quiero es algunas buenas ideas de diseño de aprendizaje Bootstrap, en lugar de valor de relleno de memoria de un elemento de la misma. . . Que se supone que? ? Oh, el dolor ah. .