Para insertar iconos, deberemos emplear la librería de iconos Font Awesome.
Por ejemplo, para insertar el icono , usaremos el siguiente código:
<i aria-hidden="true" class="fa fa-address-book-o"></i>
Para aumentar el tamaño de los iconos en relación a su contenedor, emplearemos las clases fa-lg
(aumento del 33%), fa-2x
, fa-3x
, fa-4x
o fa-5x
:
<i class="fa fa-camera-retro fa-lg"></i> fa-lg
<i class="fa fa-camera-retro fa-2x"></i> fa-2x
<i class="fa fa-camera-retro fa-3x"></i> fa-3x
<i class="fa fa-camera-retro fa-4x"></i> fa-4x
<i class="fa fa-camera-retro fa-5x"></i> fa-5x
fa-lg
fa-2x
fa-3x
fa-4x
fa-5x
Añadir iconos a los menús laterales
En caso de que queramos añadir iconos a los menús laterales, al crear o editar una página incluiremos el HTML de Font Awesome antes del título de la página.
Consejo: Incluir padding-right
al HTML para añadir un poco de espacio a la derecha del icono: