Syndicate content
> Ways to Add CSS to your Website: Numbers Two and Three

Ways to Add CSS to your Website: Numbers Two and Three

  1. Introduction
  2. What are Cascading Style Sheets?
  3. Ways to Add CSS to your Website
  4. Ways to Add CSS to your Website: Numbers Two and Three
  5. Two CSS tips.
  6. Resources and further reading


Ways to Add CSS to your Website: Numbers Two and Three

2) Linking an External Style Sheet

The second and most powerful way to employing CSS on your site is by linking your HTML documents to an external style sheet. The external style sheet contains all of your CSS for formatting your page elements. You simply link your HTML pages to it. This way, all of your page?s formatting is contained in one place and making changes is a breeze. The sample below highlights a link to an external style sheet called ?styles?.

<head>
<title>Sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="styles.css" rel="stylesheet" type="text/css">
</head>

Note that you can use absolute or relative paths to style sheets. You can even reference a style sheet with a full URL.

3) Import an External Style Sheet

The third way to employ CSS on your site is using the ?import? method. This method is similar to linking to an external style sheet and has the same benefits. The import method?s main advantage is that older browsers and browser types that do not support the import method will not read the style sheet your page links to. This is important if you want to use new or cutting edge CSS. An older browser might render your nice CSS in ways you did not intend, sometimes really messing up a web page. You use the ?import? method for CSS formatting that you want to render in newer browsers only. An example of importing a style sheet is show below.

<title>Sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
@import url("styles.css");
-->
</style>
</head>

Note: You can use all three methods of employing CSS all in one HTML page. You can also link to multiple style sheets. You may for example define your main CSS in an external style sheet and link to it. Then, for CSS that only displays well in new browsers you use the ?import? method.


Sean Buscay
www.christian-web-masters.comSean Buscay is on a mission to CREATE, ADVANCE, and EXPOUND faith in JESUS using web technology. He is the owner of Christian-Web-Masters.com .

Christian-Web-Masters.com newsletter

Stay informed on our latest news!