External Style Sheets in CSS3

cssIt is a very good practice to keep CSS styles in a separate file which is also known as sheet.  By doing so, you will have 2 files to work on, one will be HTML and another will be CSS.  You only need to add reference to the CSS style sheet using link element.  This link element should be placed inside head tag.  You can also use same style sheet in another projects.  This will result in code reusability and will save a lot of time.

Create a folder and give it a name as CSS3.  Inside that folder, create 2 files and name them as mystyles.css and index.html.  Copy and paste the code given below in those files and check the output.


div {
    background-color: red; 
    font-weight: bold;


<!DOCTYPE html>
<title>CSS Tutorials</title>
<link rel="stylesheet" type="text/css" href="mystyles.css">
<div >Hello World!</div>