I have created a few html-pages and one CSS-page inside a folder (Webservice). At first I just used to reference to my CSS-page like this because they were in the same folder.
<link rel="stylesheet" href="style.css">
Then I wanted to make it look more clean so I created separate folders for html and CSS within the already existing folder (Webservice). The new folders were named html and CSS. If I do it like down below it works, but I need to be able to access the files on other computers/devices as well.
<link rel="stylesheet" href="file:///Users/home/Desktop/Webservice/css/style.css">
It does not work to do like this:
<link rel="stylesheet" href="css/style.css">
How do I solve this?
You will have to use ../ inside the html folder to go to the parent folder.
And then you can access the css folder so your link will look like this:
<link rel="stylesheet" href="../css/style.css">
By using a relative path, it will work on your other computer.
You have to set the relative path to your CSS style from HTML file.
To view more https://desktop.arcgis.com/en/arcmap/10.3/tools/supplement/pathnames-explained-absolute-relative-unc-and-url.htm
Related
I need some help here.. I tried different links but it does not load the CSS file..
<link rel="stylesheet" type="text/css"
href="https://github.com/cengizkirazjs.github.io/cengizkiraz.github.io/styles.css">
This is the page and the outcome: https://cengizkirazjs.github.io/cengizkiraz.github.io/
Any advice? Its my first time linking CSS with HTML on Github!
As it was said in the comments, what do you think about changing file path a bit?
In your code we have this line
<link rel="stylesheet" type="text/css" href="cengizkiraz.github.io/styles.css">
It contains an absolute path. If you want to stick to this method, maybe just add a protocol, like this
<link rel="stylesheet" type="text/css" href="https://cengizkiraz.github.io/styles.css">
But it would be better if you use relative paths
In this case, our <link> will look like this
<link rel="stylesheet" type="text/css" href="styles.css">
It means that HTML will search for this file in folder, where .html file is saved. Looks slightly better, doesn't it?
I'm linking my .CSS file and Bootstrap 4.2.1 to my HTML file. The .CSS Isn't linking correctly. What is the correct way to link my .css to an HTML file? Bootstrap works but not CSS
I have tried changing the order of the links.
I have also made sure my HTML and CSS files are in the same folder
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<link rel="stylesheet" href="stlye.css"/>
you wrote stlye instead of style? maybe it's just the mispelling
or you might need to specify the path for your css
something like this before your css file ~/filename.css
<link rel="stylesheet" href="stlye.css"/> should be <link rel="stylesheet" href="style.css"/>
You spelt style wrongly. Also make sure style.css is in the same folder/path as your index.html (or whichever .html page you are using), else be sure to specify the path like so: /example/style.css.
Check that the style file exists and you are importing your stylesheet with the correct name and relative path. That means use <link rel="stylesheet" href="style.css"/> if your css is in the same folder of your html file. Otherwise provide the correct route for your file. For example would be <link rel="stylesheet" href="./app/assets/style.css"/> if your css is inside app/assets folder.
I have two folders in my website.
My directory structure like this:
In my file inside Cidadao I want to get a file from assets.
I am trying code like this:
<link rel="stylesheet" href="site/assets/plugins/bootstrap/css/bootstrap.css">
but this is not working.
Try
<link rel="stylesheet" href="../assets/plugins/bootstrap/css/bootstrap.css">
you just have the path incorrect.
it should be <link rel="stylesheet" href="/site/assets/plugins/bootstrap/css/bootstrap.css">
Or you could try <link rel="stylesheet" href="/assets/plugins/bootstrap/css/bootstrap.css">
Or you could also try <link rel="stylesheet" href="../assets/plugins/bootstrap/css/bootstrap.css">
one of those above 3 should work, / are important when it comes to filepaths.
To get from inside a folder to one level up, use ..
This is not confined to HTML though; all computer languages work like that. (Some need the slashes to be the other way around, but the principle is the same throughout.)
I've using bootstrap and file and folders is like this
root/css/..
When I include <link id="bs-css" href="css/bootstrap.min.css" rel="stylesheet"> it is working for files in root folder. But if I have file in another folder and trying to include css doesn't work. It doesn't show any style. For example
root/users/profile.php
then I include in profile.php like this
<link id="bs-css" href="../css/bootstrap.min.css" rel="stylesheet">
I've also tryed full path again didn't work properly. But if I put inside /users/ css file or full folder is working href="css/bootstrap.min.css"
You can change the link to be the full path from your URL like this:
<link id="bs-css" href="yoursite.com/css/bootstrap.min.css" rel="stylesheet">
That should work from any page.
Try using href="/css/bootstrap.min.css" This should work no matter where your php or html file is located. This is called a relative path. So..
<link id="bs-css" href="/css/bootstrap.min.css" rel="stylesheet">
As long as css is a direct child of the root, this should find it.
For the index file
<link rel="stylesheet" href="css/stylesheet.css"/>
That works fine no problem here though.
The rest of my html documents are in a folder called "pages". Here though it cant find my CSS sheet. I tried
<link rel="stylesheet" href="../oliverteglhus.dk/css/stylesheet.css"/>
Does not work. Sorry for this noob question. It's just bugging me.
it should be:
<link rel="stylesheet" href="../css/stylesheet.css"/>
If the rest of your documents are in a folder that is in the same directory as your index file, then you only need to go up one directory to find your CSS file:
<link rel="stylesheet" href="../css/stylesheet.css"/>
So, if your directory structure looks like this:
-index.html
-pages
page1.html
page2.html
etc...
-css
stylesheet.css
To load the stylesheet.css from CSS folder in page1.html, you have to use like
<link rel="stylesheet" href="../css/stylesheet.css"/>
Check this answer for a more detailed explanation