How to link an external CSS file to an HTML document

Arif Billah Babu

          

  CSS



Image not found!!

To link an external CSS file to an HTML document, you can use the <link> element within the <head> section of your HTML document. Here's an example:

html
<!DOCTYPE html>

<html lang="en">

<head>
    
<meta charset="UTF-8">
    
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    
<title>Your HTML Document</title>

    <!-- Linking external CSS file -->
    
<link rel="stylesheet" href="styles.css">


</head>

<body>
    
<!-- Your HTML content goes here -->


</body>

</html>

In the example above, the <link> element has the following attributes:

  • rel: Specifies the relationship between the current document and the linked resource. In this case, it's set to "stylesheet" to indicate that the linked file is a stylesheet.
  • href: Specifies the path to the external CSS file. In this example, it's set to "styles.css". You should replace "styles.css" with the actual path to your CSS file.

Make sure that the path to your CSS file is correct, and the CSS file is in the same directory as your HTML file or provide the correct relative or absolute path.



Category List