Why <link/> is not working?


Joined
Jan 1, 2020
Messages
1
Reaction score
0
this is my code for html im trying to use link to create a link to the main.css page but for some reason its not connecting
im new to html and dont know the factors that play into it im an expirenced coder
i got this info from a video on youtube and did the exact same syntax

HTML:
<!doctype html>
<html>
       
        <head>
            <title>my webpage </title>

            <link rel="stylesheet" type="text/css" href="styles/main.css"/>

            <style type="text/css">
                body {
                backround:red;
                font-family: arial
                }

            </style>

            </head>
           
       
   
        <body>
            <h1>big</h1>
           
                   
            <p>
            this is <strong>bold</strong>
            this is <em>italic</em>
            </p>
            <p>
            this is <strong>bold</strong>
            this is <em>italic</em>
            </p>

            <a href="[URL]http://www.google.com[/URL]">google.com</a>
            <br> <ul>
                <li><a href="page2.html">tshirts</a></li>
                <li><a href="page3.html">Hoodies</a></li>
            </ul>
            <br>

           

            <div></div>
            <span></span>

                <br><img src="[URL]https://addapinch.com/wp-content/uploads/2017/07/old-fashioned-vanilla-ice-cream-recipe-DSC_4239-500x375.jpg[/URL]">
</body>


this is the main.css page 



body {
    backround:#999;
    font-family: arial
}
 
Last edited by a moderator:
Ad

Advertisements

Joined
Nov 27, 2019
Messages
163
Reaction score
24
Herbie lets correct this first:
You have these two lines
Code:
<a href="[URL]http://www.google.com[/URL]">google.com</a>
and
<br><img src="[URL]https://addapinch.com/wp-content/uploads/2017/07/old-fashioned-vanilla-ice-cream-recipe-DSC_4239-500x375.jpg[/URL]">
The URL and /URL are hurting the links. Use
Code:
<a href="http://www.google.com">google.com</a>
and
<br><img src="https://addapinch.com/wp-content/uploads/2017/07/old-fashioned-vanilla-ice-cream-recipe-DSC_4239-500x375.jpg">

As far as linking to a CSS file.
You don't need the /> at the end. This shows me your watching an old video. If you can learn from text - read https://www.w3schools.com/

What you have shown is good and should work IF your file is in a folder entitled "styles" and that folder is in the main folder that is holding your HTML.

In other words if you look into the folder that has the "index.html" file - you will also see a folder entitled "styles". Most common mistake is to have two files "index.html" and "main.css" in the same folder. If that is the case you could leave things alone and use
<link rel="stylesheet" type="text/css" href="main.css">
 
Joined
Nov 23, 2019
Messages
67
Reaction score
1
additional

you forgot to use semicolon after arial.
and the more correct usage should be like this

<style type="text/css">

body {background-color: #999; font-family: arial; }

</style>
 
Joined
Nov 27, 2019
Messages
163
Reaction score
24
Thanks independent for the style tag reminder. The type="text/css" was mandatory for HTML4, but is optional in HTML5 which means it's on it's way out and I'd suggest you don't use it. Not needed and just adds unneeded text.
You can also use this:
<link rel="stylesheet" href="style.css">

Herbie you missed a "g" in backround:red; and as a tag on in backround:#999;
You also forgot the </html>
 
Ad

Advertisements

Joined
Jan 4, 2020
Messages
10
Reaction score
0
Herbie lets correct this first:
You have these two lines
Code:
<a href="[URL]http://www.google.com[/URL]">google.com</a>
and
<br><img src="[URL]https://addapinch.com/wp-content/uploads/2017/07/old-fashioned-vanilla-ice-cream-recipe-DSC_4239-500x375.jpg[/URL]">
The URL and /URL are hurting the links. Use
Code:
<a href="http://www.google.com">google.com</a>
and
<br><img src="https://addapinch.com/wp-content/uploads/2017/07/old-fashioned-vanilla-ice-cream-recipe-DSC_4239-500x375.jpg">

As far as linking to a CSS file.
You don't need the /> at the end. This shows me your watching an old video. If you can learn from text - read https://www.w3schools.com/

What you have shown is good and should work IF your file is in a folder entitled "styles" and that folder is in the main folder that is holding your HTML.

In other words if you look into the folder that has the "index.html" file - you will also see a folder entitled "styles". Most common mistake is to have two files "index.html" and "main.css" in the same folder. If that is the case you could leave things alone and use
<link rel="stylesheet" type="text/css" href="main.css">
Also are they in the same folder?
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads


Top