Internal / External Stylesheet

Estimated reading: 2 minutes 229 views

Html with Css

Internal Stylesheet

First we will explore the internal method. This way you are simply placing the CSS code within thetags of each (X)HTML file you want to style with the CSS. The format for this is shown in the example below.

				
					 <head>
 <title><title>
 <style type="text/css">
 CSS Content Goes Here
 </style>
 </head>
 <body>

With this method each (X)HTML file contains the CSS code needed to
style the page. Meaning that any changes you want to make to one
page, will have to be made to all. This method can be good if you need
to style only one page, or if you want different pages to have varying
styles.

External Stylesheet

Next we will explore the external method. An external CSS file can be
created with any text or HTML editor such as "Notepad" or
"Dreamweaver". A CSS file contains no (X)HTML, only CSS. You simply
save it with the .css file extension. You can link to the file externally by
placing one of the following links in the head section of every (X)HTML
file you want to style with the CSS file.

				
					 <link rel="stylesheet" type="text/css" href="Path To
 stylesheet.css" />
 
  <!--Or you can also use the @import method as shown below-->
  
   <style type="text/css">@import url(Path To
 stylesheet.css)</style>
 <!--Either of these methods are achieved by placing one or the other in the-->
 <!--head section as shown in example below.-->
 <head>
 <title><title>
 <link rel="stylesheet" type="text/css"href="style.css" />
 </head>
 <body>
 or
 <head>
 <title><title>
 <style type="text/css"> @import url(Path To stylesheet.css)
 </style>
 </head>
 <body

By using an external style sheet, all of your (X)HTML files link to one
CSS file in order to style the pages. This means, that if you need to alter
the design of all your pages, you only need to edit one .css file to make
global changes to your entire website.
Here are a few reasons this is better.
Easier Maintenance
Reduced File Size
Reduced Bandwidth
Improved Flexibility