My CSS file is not linked with HTML


#1

Hello Everyone,

I am using a free software for practice name Brackets as most of the developers knew. I did very basic html code just using simple HTML,HEAD, P, H1 element and for style these elements i did very basic CSS programming.

CSS Code.

h1, h2 {
    font-family: sans-serif, serif, Arial;
    font-size: 36px;
    font-weight:100;
    color: black;
    letter-spacing: 0.3em;
    
}

p {
    font-family: cursive, sans-serif, "Times New Roman";
    font-size: 20px;
    color: darkgray;
}

To link with HTML as define in the lesson, i used
"<link href="/style.css" type="text/css" rel="stylesheet">" in the header element.

I also save these two files in the same directory but when i compile, it shows the raw text only HTML.
Any suggestion would be appreciate.


#2

Try writing it like,

href="style.css"

#3

Which OS are you using? Given you use a forward slash in the href value

given the files are in the same directory, style.css should do as value for href attribute

the forward slash indicates root directory in *nix systems (root is the top of the tree :smiley: ), in windows backslashes are used in path.


#4

Well Thanks mtf and Stetim94 !!

@ yes it works with out back or forward slash. Its great, Could you please explain why its working without slashes.?
When in real making a template or working in webserver should i include “/” Backslash for define the directory .?


#5

On a server (or any volume) / is the site root (where the home page resides).

Eg.

http://www.codecademy.com/

The trailing slash is the site root. Any path names written with a slash in front will direct the request to the root.

"/about.html"

"/css/style.css"

These courses reside in folders that are not on the site root.

Eg.

https://www.codecademy.com/courses/web-beginner-en-HZA3b/0/1

            site root / courses / course unit / lesson

If we assume the style sheet is in the same folder as our index.html file, then we would not need any slashes in our link href.


#6

haha V.Nice… Its simple … Well yes Now i Understand why we use slashes, here we dont need slash because of the same folder but if not then we need to define the directory.
Alright! thats tricky but yes simple, although its kind of interesting just like some MATH problem.
Thank you very much mtf !!:grinning:


#7