Bootstrap Pantalla gigante (Jumbotron)
Este capítulo explicará otra característica compatible con Bootstrap, el Jumbotron (Pantalla gigante). Como su nombre indica, este componente puede aumentar el tamaño de los títulos y añadir más márgenes externos (margin) al contenido de la página de destino. Los pasos para usar el Jumbotron son los siguientes:
- Cree un contenedor `<div>` con la clase.jumbotron. (el selector de clase).
- Además de un `<h1>` más grande, el grosor de la fuentefont-weightse reduce a 200.
El siguiente ejemplo demuestra esto:
Ejemplo
<div class="container">
<div class="jumbotron">
<h1>¡Bienvenido a la página de destino!</h1>
<p>Este es un ejemplo de un Jumbotron (Pantalla gigante).</p>
<p><a class="btn btn-primary btn-lg" role="button">Saber más</a>
</p>
</div>
</div>
Pruébalo »
El resultado se muestra a continuación:
Para obtener un Jumbotron que ocupe todo el ancho y sin esquinas redondeadas, en todas las.containerclass, use por fuera la.jumbotronclass, como se muestra en el siguiente ejemplo:
Ejemplo
<div class="jumbotron">
<div class="container">
<h1>¡Bienvenido a la página de destino!</h1>
<p>Este es un ejemplo de un Jumbotron (Pantalla gigante).</p>
<p><a class="btn btn-primary btn-lg" role="button">Saber más</a>
</p>
</div>
</div>
Pruébalo »
El resultado se muestra a continuación:
