HTML Link to external CSS file

HTML-CSS
1 
> <!DOCTYPE html>
> 
> <header>
> <meta charset="UTF-8">
> <title>Homepage.html</title>
> <link rel="stylesheet" type="text/css" href="./style.css"/>
> </header>
> 
> <body>
> <main>
> <div>
> <h1>test</h1>
> <p>
> test
> </p>
> </div>
> </main>
> </body>
> 
> </html>

This is what I have, and I thought I had it linked right but it doesnt work, my CSS file is named style.css.

2

If your folder structure is like,
FolderName
|_index.html
|_style.css

Then it should be href="style.css"

2 Likes
3

Hello @Sujith3021

Thank you for the reply but it still doesnt work D:

Heres some more of the code.

This is my main html text:
> <link rel="stylesheet" type="text/css" href="style.css"/>

Heres my css file:

``` div { background-image: linear-gradient(black,white,white,black); } 
Let me know if you need anything else. I have no clue why its not working.

Thanks.
4

Actually what is your aim…??

5

External ccs style sheet

1 Like
6

Try writing the full path. Is it online or in your local machine?
Example for online:

<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"/ >

Example for machine:
<link rel="stylesheet" type="text/css" media="screen" href="C:\Users\eduardo.pimenta\Documents\Visual Studio\Workspace\play\css.css" />

1 Like
7

Your link and title should go inside <head></head> tag, you have placed it inside header.

Replace header with head

8
  1. Put css link here same with your title and meta. Remove
  2. is your css file in a separate folder or same place with html file or external? Your response will determine what to show you.
  3. Make sure the names are thesame
  4. Applications like Visual Studio Code can help you test out the link when you hover and click the link it will open the css code. Which means they are connected.