Home >> Tutorials/FAQs >> CSS Tutorials >> Index

CSS Tutorials - Storing CSS Definitions in External Files

By: FYICenter.com

(Continued from previous topic...)

How To Store CSS Definitions in External Files?

If you want to share a set of CSS definitions with multiple HTML documents, you should those CSS definitions in an external file, and link it to those HTML documents using the LINK tag in the HEAD tag as:

<HEAD>
...
<LINK REL=stylesheet TYPE="text/css" HREF="css_file_url"/>
...
</HEAD>

Below is a CSS file called, fyiCenter.css, that stores the same CSS definitions used in the previous exercise:

  BODY {background-color: black}
  P {color: yellow}

If you modify the HTML document with the LINK tag instead of the STYLE tag, you can get the same result:

<html><head>
<title>CSS Linked</title>
<link rel=stylesheet type="text/css" href="fyiCenter.css"/>
</head><body>
<p>Welcome to FYICenter.com. 
You should see this text in yellow on black background.</p>
</body></html>

(Continued on next topic...)

  1. What Is CSS (Cascading Style Sheets)?
  2. What Is the Basic Unit of CSS?
  3. How Many Ways to Attach CSS to HTML Documents?
  4. How To Include CSS Inside an HTML Tag?
  5. How To Include CSS Inside the HEAD Tag?
  6. How To Store CSS Definitions in External Files?
  7. How Many Ways to Select HTML Tag Instances?
  8. What Is a Class Selector?
  9. What Is an ID Selector?
  10. What Is a Contextual Selector?
  11. What Is a Group Selector?
  12. What Is a Mixed Selector?
  13. What Are the Pseudo Classes on <A> Tags?
  14. How To Group CSS Definitions Together?
  15. What Is Style Property Inheritance?
  16. What Is CSS Cascading?
  17. What Are the CSS Cascading Order Rules?
  18. How To Remove the Top White Space of Your Web Page?
  19. How To Set Different Text Fonts Inside Tables?
  20. How To Use Class Selectors to Differentiate Tag Instances?
  21. How To Use IDs to Override Classes?

Selected Developer Jobs:

More...