Fundación del icono
Fundación ofrece 283 iconos, se puede definir el tamaño de su estilo con css.
Los iconos se pueden utilizar para el texto, botones, barras de herramientas de navegación, formularios, y así sucesivamente.
Los siguientes son ejemplos de la Fundación iconos:
Botón Actualizar:
Icono de detección:
icono de inicio:
icono de la sintaxis
Crear sintaxis iconos es el siguiente:
<i class="fi-name"></i>
Reemplazar nombre del icono parte del nombre.
Para utilizar un icono necesitamos la sección <head> para agregar el archivo de icono de estilo:
<link rel="stylesheet" href="http://static.w3big.com/assets/foundation-icons/foundation-icons.css">
Ejemplos de iconos
Los siguientes ejemplos demuestran el uso de iconos:
Ejemplos
<P> icono de la nube como un enlace :
<A Href = "#"> <i class = "fi-nube"> </ i> </ a>
</ P>
<P> Nube labró el icono: < i class = "fi-nube" style = "font-size: 35px; color: red;"> </ i> </ p>
<P> icono de Inicio: <i class = "fi-casa"> </ i> </ p>
<P> icono de Inicio en un botón :
<= Tipo de botón de clase "botón" "botón" =>
<Clase I = "fi-casa "> </ i> Inicio
</ Button>
</ P>
<P> icono de Inicio en un verde botón:
<Tipo botón = "botón de" clase = "éxito botón">
<Clase I = "fi-casa "> </ i> Inicio
</ Button>
</ P>
<P> icono de Inicio en un gran botón, la luz azul enlace:
<A Href = class = "#" información "button large">
<Clase I = "fi-casa "> </ i> Inicio
</ A>
</ P>
Trate »
iconos de la barra
Podemos utilizar .icon-bar clase para crear un determinado número de iconos de la barra:
Ejemplos
<A Href = "#" class = "item">
<Clase I = "fi-casa "> </ i>
</ A>
<A Href = "#" class = "item">
<I class = "fi-marcador "> </ i>
</ A>
<A Href = "#" class = "item">
<I class = "fi-info "> </ i>
</ A>
<A Href = "#" class = "item">
<I class = "fi-mail "> </ i>
</ A>
<A Href = "#" class = "item">
<Clase I = "fi-como "> </ i>
</ A>
</ Div>
Trate »
Icono Descripción Uso <label> elemento:
Ejemplos
<A Href = "#" class = "item">
<Clase I = "fi-casa "> </ i>
<Label> Inicio </ label>
</ A>
<A Href = "#" class = "item">
<I class = "fi-cuota "> </ i>
<Label> Compartir </ label>
</ A>
<A Href = "#" class = "item">
<I class = "fi-info "> </ i>
<Label> Información </ label>
</ A>
<A Href = "#" class = "item">
<I class = "fi-mail "> </ i>
<Label> Correo </ label>
</ A>
<A Href = "#" class = "item">
<I class = "-fi de aumento de vidrio"> </ i>
<Label> Buscar </ label>
</ A>
</ Div>
.disabled clase permite convertirse en icono de estado no se puede hacer clic:
Ejemplos
<I class = "fi-cuota "> </ i>
</ A>
<A Href = "#" class = "item disabled">
<I class = "fi-mail "> </ i>
</ A>
Trate »
.vertical clase se utiliza para crear una barra de herramientas vertical:
Manual de Referencia de los iconos de la Fundación
Más información sobre el contenido del icono, puede hacer referencia a nuestro manual de icono de la Fundación.