Linking the CSS File

<PLEASE USE THIS TEMPLATE TO HELP YOU CREATE A GREAT POST!>

<Below this line, add a link to the EXACT exercise that you are stuck at.>

Linking the CSS File
<Below this line, in what way does your code behave incorrectly? Include ALL error messages.>
I just don’t under stand the style.css part

```

Replace this line with your code.

<do not remove the three backticks above>

The file, style.css is an external file that is located in the same working directory as your index.html file. To import (load) it into the document namespace we use the HTML <link> element, which is used exclusively in the <head></head> element.

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

The HEAD of the document is where all the METADATA is imported. This data is for the browser, not the end user. A style sheet is a form of metadata.

The three attributes are,

href

The h stands for hypertext and the ref stands for reference. It refers to a resource location or URL.

type

This tells the browser the MIME Type of the file so it knows how to parse it into the DOM.

rel

This stands for relation. The attribute tells the user agent what relation this resource has to the document.

5 Likes

can you make it a little bit more pecise plz

Hi, I am in the same style.css exercise and it is not loading when I add it in text- run it- and it keeps loading continuously and nothing happens. I can’t get to next part of exercise. Help

We will require a link to the exercise so we can review the material and test the solution given above. Please post the URL in the location bar of your exercise window. Thanks.

To review, what is the <link> element and how might it be used?

It can be used in the <head></head> element only, and will always have an href attribute.

<!DOCTYPE html>
<html>
  <head>
    <link href="styles.css">
  </head>
  <body>

  </body>
</html>

The above is valid HTML5 but it makes two assumptions. One, that the browser will recognize its MIME type from the file header; and two, that it will recognize it as a style sheet so it get properly parsed into the DOM. Fortunately in the majority of modern browsers we can safely make these assumptions since HTML5 has made the type and relation both moot, or rather, de facto.

The earlier example does not make those assumptions and includes both the type and the rel attribute with explicit values which would be needed still by older browsers.

The href is always a URL to an external resource, external meaning separate from the document html file. It can be anywhere on the network, local volume, another computer, a web server or content delivery network. For our purposes at present the file is in the same directory as the HTML page, index.html.

1 Like

https://www.codecademy.com/courses/learn-html-css/lessons/css-setup/exercises/html-link-css?action=lesson_resume&link_content_target=interstitial_lesson --Thanks

I am stuck at 5/6 of lesson and I have already added herf, type, rel , but it still compiling on the host site

I notice it talks about relative path and uses, "/style.css". Is that what you are using?

1 Like

yes, the lesson is to add and after adding this code, nothing happens when I hit run

yes, I am adding the code to style.css and in index.html I add the herf, type and ref. It is not loading in the host
(result )window

If this is what your code looks like then it is a misspell.

A post was split to a new topic: Stuck in this part

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.