Los iconos se pueden agregar fácilmente a su página HTML mediante el uso de una biblioteca de iconos.
¿Cómo agregar iconos?
La forma más sencilla de agregar un ícono a su página HTML es con una biblioteca de íconos, como Font Awesome.
Agregue el nombre de la clase del icono especifico a cualquier elemento HTML en línea (como <i>
o <span>
).
A continuación, todos los íconos en las bibliotecas de íconos son vectores escalables que se pueden personalizar con CSS (tamaño, color, sombra, etc.)
Íconos de Font Awesome
Para usar los íconos de Font Awesome, vaya a fontawesome.com, inicie sesión y obtén el código para agregar en la sección <head>
de su página HTML:
<script src="
https://kit.fontawesome.com/*yourcode*.js
" crossorigin="anonymous"></script>
Nota: No se necesita descargar o instalar.
Ejemplo:
Íconos de Bootstrap
Para usar los glifos de Bootstrap, agregue la siguiente línea dentro de la sección <head>
de su página HTML:
<link rel="stylesheet" href="
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
">
Nota: No se necesita descargar o instalar.
Ejemplo:
Íconos de Google
Para usar los íconos de Google, agregue la siguiente línea dentro de la sección <head>
de su página HTML:
<link rel="stylesheet" href="
https://fonts.googleapis.com/icon?family=Material+Icons
">
Nota: No se necesita descargar o instalar.
Ejemplo:
Resumen
Los iconos se pueden agregar fácilmente a una página HTML mediante el uso de bibliotecas de iconos como Font Awesome, Bootstrap o Google. Los iconos son vectores escalables que se pueden personalizar con CSS. Para usarlos, simplemente agregue el nombre de la clase del icono a cualquier elemento HTML en línea.
Traducido con 💚 desde W3Schools.com