Menú principal

Tema 2

Cabeceras

Distintos métodos para maquetar una cabecera.

Método A.

<span class="cabecera">El título más molón</span>

.cabecera {
                   font-size: 24px;
                   font-weight: bold;
                   color: blue;
                 }

 

Método B.

<p><b>El título más molón</b></p>

Método C.

<h1>El título más molón</h1>

 

Código CSS - Extras

<h1>El título más molón</h1>

Borde gris de 1-pixel por debajo del texto.

h1   {
                  font-familiy: Arial, sans-serif;
                  font-size: 24px;
                  color: #369;
                  padding-bottom: 4px;
                  border-bottom: 1px solid #999;
       }

Super título

 

Añadir fondos

h1   {
                  font-familiy: Arial, sans-serif;
                  font-size: 24px;
                  color: #fff;
                  padding: 4px;
                  background-color: #696;
       }

 

Fondos y bordes

h1   {
                  font-familiy: Arial, sans-serif;
                  font-size: 24px;
                  color: #666;
                  padding: 4px;
                  background-color: #696;
                  border-bottom: 2px solid #ccc;
       }

 

Enlosar los fondos

h1   {
                  font-familiy: Arial, sans-serif;
                  font-size: 20px;
                  color: #869;
                  padding-bottom: 14px;
                  background: url(img/gradiente.gif) repeat-x bottom;
       }

Super título

 

Trueque de iconos

h1   {
                  font-familiy: Arial, sans-serif;
                  font-size: 24px;
                  color: #369;
                  padding-left: 30px;
                  background: url(transaparente.gif) no-repeat 0 50%;
       }

Super título