Css Tutorial – How to add a css file to a html page

Jul 04, 2012, by admin

HyperText Markup Language (HTML) describes what the different pieces of a web page are. The Cascading Style Sheets (CSS) coding language describes what those pieces should look like. A CSS file can be added to HTML as an external style sheet, CSS included in a separate file from the HTML, or an internal style sheet, CSS included within the HTML file. Learn how to add a CSS file to a HTML page in order to customize your website design.

Easy steps

Add an External Style Sheet to HTML

1.Prepare and save your CSS file with the “.css” file type.

2.Upload your CSS file to your website.

3.Copy the link to your CSS file.

It’s good form to remove the main domain name from the link (URL). Therefore a URL of “” http://mysite.com/css/default.css” would be shortened to “/css/default.css”. You must include that leading slash (“/”). Removing all unneeded text help your site load as quickly as possible.

4.Find the tag in your HTML file.

5.Create an empty line under the tag.

6.Add <LINK rel=stylesheet type=text/css href=”ADD CSS URL HERE”>to that empty line, changing ADD CSS URL HERE to the link to your CSS file, but keep those single quotation marks.

7.Save your HTML file, and upload it to your website.

8.Verify that everything on your site looks how it is supposed to look. If it doesn’t, you may need to go back and look for any corrections or adjustments you need to make.

Add an Internal Style Sheet to HTML

 1.Find the tag in your HTML file.

 2.Beneath the

<META>tags (but before the tag) in your HTML file, create some empty lines.

  1.Add

<STYLE type=text/css> to one empty line.

# Skip two lines and add </STYLE> .

 1.Add all your CSS between those two tags you just added.

2.Save your HTML file (as HTML).

3.Verify that your web page looks like it is supposed to look. Make changes as necessary if it doesn’t.