He buscado por todas partes y parece que no puedo encontrar una respuesta. Estoy creando un sitio web con React y quiero incluir una hoja de estilo. Mi aplicación React tiene el archivo index.html y creé una línea en el archivo que dice:
<link rel="stylesheet" type="text/css" href="homePage.css">
pero React no cargará el css. ¿Cómo hago esto correctamente?
Nota al margen: React tampoco carga imágenes. Cuando pongo una línea de código en mi JSX así:
<a href="./my_resume.pdf"><img id="resume" src="./views/icons/resume_logo.png" /></a>
React no carga la imagen. Por favor ayuda, he estado golpeando mi cabeza contra mi escritorio por esto por un tiempo.
Gracias por adelantado.
en su archivo html, todo lo que necesita hacer es una declaración de enlace normal
<link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/journal/bootstrap.min.css" rel="stylesheet" integrity="sha384-1L94saFXWAvEw88RkpRz8r28eQMvt7kG9ux3DdCqya/P3CfLNtgqzMnyaUa49Pl2" crossorigin="anonymous" />Me gusta para que uno sea de un sitio web pero puedes hacer lo mismo con uno local como
<link src="/styles/maincss.css" rel="stylesheet" />que funcionará
Es probable que el problema esté relacionado con la ubicación de sus archivos y la forma en que los está referenciando. Por ejemplo, ¿ my_resume.pdf está en la misma carpeta que index.html ? ¿Está homePage.css también en la misma carpeta?
El prefijo / es relativo al directorio raíz .
El prefijo ./ es relativo al directorio de trabajo .
El prefijo ../ es relativo al directorio principal .
Para obtener más información sobre las URL relativas y absolutas, recomiendo consultar el artículo de Coffee Cup sobre el tema.
¡Espero que esto ayude!
¡Cameron Payton! ¿Puedes usar rutas relativas para ello? En su lugar, utiliza rutas absolutas. Ejemplo: http://su-dominio/homePage.css y http://su-dominio/views/icons/resume_logo.png
Creo que te ayudará. Por favor vuelve a mi. Gracias !
