I've looked everywhere and can't seem to find an answer. I am building a website with React, and I want to include a stylesheet. My React app has the index.html file and I created a line in the file that says:
<link rel="stylesheet" type="text/css" href="homePage.css">
but React won't load the css. How do I do this properly?
Sidenote: React also doesn't load images. When I put a line of code in my JSX like this:
<a href="./my_resume.pdf"><img id="resume" src="./views/icons/resume_logo.png" /></a>
React won't load the image. Please help, I've been banging my head against my desk about this for a while now.
Thanks in advance.
in your html file all you need to do is a normal link statement
<link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/journal/bootstrap.min.css" rel="stylesheet" integrity="sha384-1L94saFXWAvEw88RkpRz8r28eQMvt7kG9ux3DdCqya/P3CfLNtgqzMnyaUa49Pl2" crossorigin="anonymous" />
Like so that one is from a website but you can do the same thing with a local one like
<link src="/styles/maincss.css" rel="stylesheet" />
that will work
The problem is likely with the location of your files and the way in which you're referencing them. For example, is my_resume.pdf in the same folder as index.html? Is homePage.css also in the same folder?
The prefix / is relative to the root directory.
The prefix ./ is relative to the working directory.
The prefix ../ is relative to the parent directory.
For further information regarding relative and absolute URLs, I recommend checking out Coffee Cup's article on the topic.
Hope this helps!
Cameron Payton ! can you using relative paths for it. Instead you use absolute paths. Example: http://your-domain/homePage.css and http://your-domain/views/icons/resume_logo.png
I think it will help you. Please get back to me. Thanks !
