ven porque poner muestran los iconos icon font cuadrados como cargan awesome aparecen html css fonts font-awesome

porque - no se ven los iconos html



Iconos de Font-Awesome que no se representan a través de BoostrapCDN (3)

Lo que Pulkit respondió es absolutamente correcto. Solo para agregar, si desea crear un servidor local rápido, simplemente vaya al directorio de las páginas html y css, y luego vaya a la terminal y escriba -

$ python -m SimpleHTTPServer

Luego, vaya a su navegador y vaya a 127.0.0.1:8000. Si no aparece, intente cambiar la página de inicio de su sitio web a index.html.

Intento usar las fuentes del icono Font-Awesome a través del enlace BootstrapCDN, del cual estoy bastante seguro de que tengo la última versión de:

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

Puse este enlace en la parte <head> de mi archivo html y estoy intentando que funcione con este código html simple de:

<!DOCTYPE html> <html> <head> <title>Font-Awesome Icons</title> <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"> </head> <body> <p><i class="fa fa-camera-retro"></i> Camera Icon<i class="fa fa-facebook"></i> Facebook Icon</p> </body> </html>

Sin embargo, no está renderizando. Probé este código en las últimas versiones de FireFox (27), Safari (7) y Chrome (33). Comprobé que la clase fa está en cada uno de los íconos que estoy tratando de invocar y también que el prefijo fa se usa en oposición al antiguo prefijo de icon- . Revisé mi implementación del código con este video http://headwaythemes.com/using-font-awesome-with-headway/ (aunque para un tema de WordPress, en principio el código debería funcionar igual) y miré a mi alrededor en el desbordamiento de la pila, pero las preguntas anteriores, como Fontawesome no se han cargado , no me han ayudado a resolver mi problema.

No tengo el archivo fontawesome.otf instalado, pero seguramente no es eso si puedo ver los glifos al visitar http://fortawesome.github.io .
¿Debo simplemente descargar y alojar los archivos de fuentes geniales junto con mi futuro sitio web para que no tenga que preocuparme por actualizar también el enlace de BoostrapCDN? - ¿Aunque solo planeo usar algunos íconos?


Una forma más sencilla de lidiar con esto: simplemente agregue ''http:'' al frente de la línea cdn, y funcionará en su máquina local, es decir, así:

<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Ta-daa!


La razón por la que no se carga es porque el URI está comenzando con "//". Eso significa que es una ruta relativa al protocolo, lo que significa que usará el protocolo que use esa página. Si abre su html localmente, su navegador usará el archivo como el protocolo, tratando de acceder al css font-awesome con "file: //". Si accede a su html usando un servidor web http local o remoto, entonces accederá a la página usando el protocolo http , accediendo al CSS con "http: //".

Solución:

  1. Cambie la ruta del CSS o imítelo en su máquina local.
  2. Ejecute un servidor http local o remoto y acceda a la página.

Para más información: URI que comienza con dos barras ... ¿cómo se comportan?