I linked my stylesheet customstyle.css to my index.html but when i copy the folder to another drive the stylesheet wont get linked how do i overcome this problem as i have to send the folder to another person
<link rel="stylesheet" type="text/css" href="D:\healthplus\style.css">
Make sure that index.html and customstyle.css are in the same folder. Then in index.html you should link to your stylesheet like this:
<link rel="stylesheet" type="text/css" href="customstyle.css">
This is a relative path because it doesn't start with a /
Related
I've run my css through a validator (nothing is wrong)
My header looks as following (with irrelevant pieces removed)
<head>
<link href="https://fonts.googleapis.com/css2?family=Lato:wght#400&display=swap" rel="Stylesheet">
<title>Projekter</title>
<link rel="Stylesheet" href="Stylesheet.css">
</head>
and my stylesheet is named Stylesheet.css in the following folder hierachy
What could possibly be wrong here?
Please do tell me if I'm missing giving some relevant information.
The stylesheet call path is invalid.
The index.html file is in the HTML folder and Stylesheet.css is outside the HTML folder.
Please correct it as follows.
<link rel="stylesheet" href="../Stylesheet.css">
Chrome DevTools makes it easier to determine the cause.
Image of my website page code
Image of the css code
As you can see the background and font change are not showing up even though I have linked them and refreshed the page numerous times after saving.
try these
<link rel="stylesheet" href="main.css" />
<link rel="stylesheet" href="./styles/main.css" />
use only main.css if the css file is in the same folder as your index.html
use ./styles/main.css if the css file is in another folder.
send a ss with your root folder with the files you are using in this project if it doesn't work
The problem is that my CSS is not loading.
I have a folder /var/www/example, and in it i have my index.php
and another folder assets where i have the folder /css
in my index.php i linked the css like this :
<link type="text/css" href="/assets/css/style.css" rel="stylesheet">
But when i put style.css in /var/www/example with index.php and i change my code to
href="style.css it works !!
im working with Apache2
The root directory is example so you have to put /example before assets the link should be like the example below, Another idea is to remove the / before assets as it is not the root directory (i.e it is directory) of the index.php file.
<link type="text/css" href="/example/assets/css/style.css" rel="stylesheet">
I have a HTML file and a CSS file located in different directories in my PC.
in the head tag I use a link tag to reference my css file
<link href="C:\Users\UserName\Desktop\Web_testing\BGsample SS.css"
type="text/css" rel="stylesheet" />
this doesn't work
try using the file:/// protocol.
href='file:///C:\Users\UserName\Desktop\Web_testing\BGsample SS.css'
If that doesn't work (and you say it doesnt), then my guess is that it won't work at all due to it being prevented by security features in the browser.
It depends on where you are loading the main HTML content from, but if the main HTML is loaded from the internet then I can understand why the browser might object to loading the CSS from the client machine's local file system.
One final thing to try: You might try setting up a web server on your machine, putting the mystyles.css file into the web folder, and loading it into the page using:
href='http://localhost/mystyles.css'
I can't really suggest much else, I don't think.
Check your paths, Best practices is to always use a relative paths. Ex
If your stylesheet is called style.css the link should be:
<link rel="stylesheet" type="text/css" href="style.css" />
If you have the css file in a subdirectoy (and the subdirectory is called styledirectory) the link becomes:
<link rel="stylesheet" type="text/css" href="styledirectory/style.css" />
If the css file is in the parent directory of the html file the links becomes:
<link rel="stylesheet" type="text/css" href="../style.css" />
.. goes up 1 directory, if you need two you could do: ../../
Sample Folder structure
Assuming structure is like that then,
<link rel="stylesheet" type="text/css" href="styles/BGsampleSS.css" />
Name files without spaces too.
You should be using '../' to move back in your path, and then into the directory with the CSS file.
Please always follow the CSS External Style Sheet way. In your case the CSS file cannot be located. Try adding \ before SS.css
<link rel="stylesheet" type="text/css" href="C:\Users\UserName\Desktop\Web_testing\BGsample\SS.css">
This is the link: https://footballcoder.github.io/YearOfCode/projects/about.html (source code: https://github.com/FootballCoder/YearOfCode)
If you see in my repo, I have a folder called projects and in there I have my about.html, and a folder called css. I have a file in the css subfolder that is called about.css, which is the css for about.html. I don't know why the css isn't being used. Is it the way the file is being linked or some other error. The link from the HTML file is in the tags.
change this
<link rel="stylesheet" type="text/css" href="/projects/css/about.css">
to this
<link rel="stylesheet" type="text/css" href="./css/about.css">
I hope this article can help you
You refer to the link as such:
<link rel="stylesheet" type="text/css" href="/projects/css/about.css" />
See if the following edit (removing '/projects/') fixes the problem.
<link rel="stylesheet" type="text/css" href="css/about.css" />
This should work because it is linking the path starting at the serving html, aka about.html, not at the root of your site. Just tested it with Dev Tools in Chrome, and it looks like it works (and is super cool!)
Side note: if your fonts from Google aren't loading, move the custom CSS below those links in the head. I'm not sure if they are or not since I'm not familiar with them, but that will work if that is also an issue.