ExpertRating - Online Certification and Employment Testing ExpertRating - Online Certification and Employment Testing ExpertRating - Online Certification and Employment Testing

ExpertRating Home
ExpertRating Benefits
Recommend ExpertRating
Suggest More Tests
Privacy Policy
FAQ
Login
 
CSS Tutorial - Index
CSS Tutorial - Introduction to CSS
CSS Tutorial - Basic CSS Concepts
CSS Tutorial - Linking Style Sheets
CSS Tutorial - Text Formatting
CSS Tutorial - Backgrounds
CSS Tutorial - Fonts
CSS Tutorial - Borders
CSS Tutorial - Margins and Padding
CSS Tutorial - Lists
CSS Tutorial - Dimensions
CSS Tutorial - Display and Positioning
CSS Tutorial - Pseudo Classes and Elements
CSS Tutorial - W3 Standards,Validation of Style
     

 
Online Personal Trainer Certification
Personal Trainer Certification (Spanish)
Six Sigma Certification
Find a Personal Trainer
Project Management Certification
Six Sigma Certification
Six Sigma Black Belt Certification
Master Black Belt Certification
Six Sigma Green Belt Certification
Life Coach Certification
Lean Management Certification
Lean Six Sigma Certification
First Aid Certification
CPR Certification
Yoga Certification
Aerobics Certification
Pilates Certification
Business Analyst Certification
SEO Certification
Online Business Writing Course & Certification
Baby Sitting Course & Certification
Time Management Certification
Health Club Management Certification
Medical Coding Certification
Medical Billing Certification
Business Analysis Course
Master Trainer Certification
Total Quality Management Certification
Kaizen Certification
Creative Writing Certification
Event Management Certification
Test Search by Job Title
Administrative Assistant Certification
Virtual Assistant Certification
  All Online Courses
   

   
   
   
   
   
   

   
  Home > Courses, Tutorials & eBooks > CSS Tutorial > Linking Style Sheets
 

CSS Tutorial - Linking Style Sheets

    Page 1 of 2
 
Overview
 

In this chapter you will learn:

  • Methods of linking a style sheet to a web page
  • Benefits of using an external style sheet
  • SPAN and DIV tags
 

This chapter will describe the methods of linking style sheets.

There are 3 ways to link styles with your document. You can do this with the help of:

1. Inline style sheets

2. Embedded style sheets

3. External style sheets   

 
Inline Style Sheet

 

While using Inline Style Sheets the following points have to be kept in mind-

  • The style attribute is used with the relevant HTML tag.

  • The style attribute can contain any CSS property.

  • Inlining style is not a very flexible tool while working with style sheets because it mixes
    the content with the presentation.

  • It should only be used when different styles are to be applied in a document.          

 

Example

 

                        <p style = "color : red ; margin-left : 200px">

                              This paragraph is now of red color with left margin of 200px.

 
 
Internal Style Sheet

 

While using Internal style sheet the following points have to be remembered-

  • Internal style sheet is also known as embedded style sheet.

  • It is used when a single document has to follow a unique style.

  • It uses the style tag and is defined in the head section of a document

  • If the same style sheet is used in multiple documents, then an external style sheet would be more appropriate.
 

Example

 

<html>
           <head>
            <style type = "text/css">
                    body { background color : red ;}
                    p { color : white ; margin-left : 100px;}
                    h1 { font-size : 18 px ; font-color : black; text-align : center;}

           </style>
           </head>
            <body>

            <h1>Internal CSS</h1>
            <p>This HTML document uses internal CSS. With this style sheet we can
                    achieve uniformity in our page.</p>

            </body>
            </html>

 

The output would look like :       

 

 Internal CSS

                 This HTML document uses internal CSS. With this style sheet we can

achieve uniformity in our page.

 

 
External Style Sheets

 

When using External Style Sheets the following points have to be noted-

  • An External Style Sheet is used when the style is to be followed in more than one page.
  • If there has to be changes in the style of the entire document, then changes are done at one place only.
  • The style sheet uses the link tag to link with each page in the document.
  • The link tag is included inside the head tag.

Every page which has a link to this style sheet will follow the same formatting rule.

 

 

 
     
Home  |  About Us  |  Privacy Policy  |  Site Map  |  FAQs  |  Contact Us
 
© ExpertRating 2006. All Rights Reserved.