Color en formato RGB
.jumbotron h1 {
color: rgb(102,153,0);
}
Color en formato HEX
.jumbotron h1 {
color: #9933CC;
font-family: 'Open Sans', sans-serif;
font-size: 48px;
background-color: #cccccc;
background-image: url('https://goo.gl/04j7Nn');
border: 3px solid #cc0000;
padding: 23px;
padding-top: 10px;
padding-bottom: 23px;
margin: 14px;
margin-top: 10px;
margin-left: 15px;
Para centrar un titulo le hacemos lo siguiente:
margin-right: auto;
margin-left: auto;
}
Formateo de la fuente de un elemento de HTML
font-family: Arial, Helvetica, sans-serif;font-family: "Times New Roman", Times, serif;font-family: "Courier New", Courier, monospace;.jumbotron {
height: 500px;
background-image: url('https://goo.gl/04j7Nn');
}
.jumbotron h1 {
color: red;
font-family: 'Open Sans', sans-serif;
font-size: 48px;
font-weight: bold; position: relative;
top: 91px;
left: 55px;
} .jumbotron p {
color: #fff;
font-size: 20px;
}Google Font: Mas de 600 fuentes .nav a {
color: #5a5a5a;
font-size: 11px;
font-weight: bold;
padding-top: 14px;
padding-bottom: 14px;
padding-left: 10px;
padding-right: 10px;
text-transform: uppercase
}.learn-more {
background-color: #f7f7f7; clear: both;
}.learn-more h3 {
font-family: 'Shift',sans-serif;
font-size: 18px;
font-weight: bold;
} img {
float: right;
} .nav li {
display: inline;
}
.jumbotron .container {
position: relative;
top: 100px;
}
Bootstrap: Barra de pestañas
<ul class="nav nav-tabs">
<li><a href="#">Primary</a></li>
<li class="active"><a href="#">Social</a></li>
<li><a href="#">Promotions</a></li>
<li><a href="#">Updates</a></li>
</ul>
<ul class="nav nav-pills">
<li><a href="#">Primary</a></li>
<li class="active"><a href="#">Social</a></li>
<li><a href="#">Promotions</a></li>
<li><a href="#">Updates</a></li>
</ul>
El Grid de Bootstrap tiene 12 columnas, por lo cual para trabajar con este grid, hacemos lo siguiente:
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4"></div>
<div class="col-md-4"></div>
</div>
o podemos dividirlo como queramos pero que de como resultado 12 columnas.
Creación de thumbnail:
<div class="col-md-4">
<div class="thumbnail">
<img src="http://goo.gl/0sX3jq" />
</div>
<div class="thumbnail">
<img src="http://goo.gl/an2HXY" />
</div>
</div>
