1. Different Ways to InsertDifferent Ways to Insert
in CSSin CSS
www.navdeepkumar.comwww.navdeepkumar.com
2. What is CSS?What is CSS?
CSS (Cascading Style Sheets)CSS (Cascading Style Sheets)
Cascading Style Sheets is a presentation definition
language that is used to control the layout of HTML
document by attaching styles. With CSS you can
apply styles such as color of text set margins of
fonts, background, images, spacing between
paragraph and words and much more.
www.navdeepkumar.comwww.navdeepkumar.com
3. Types of CSS
There are following three ways in which style
sheets can be called or inserted in any HTML
document:
• External style sheet
• Internal style sheet
• Inline style
www.navdeepkumar.comwww.navdeepkumar.com
4. External style sheet
In this case a separate file is created in which all the styles
for every web page element is declared and defined. This file
is a CSS file and has an extension of .css. Then you have to
attach the style sheet with your html page.
<link href=”style.css” rel=”stylesheet” type=”text/css”>
In the value of href=”style.css” you will write the path where
you have placed your cascading style sheet.
www.navdeepkumar.comwww.navdeepkumar.com
5. Internal style sheet
• You can also put all the styles inside the tag of your
html page. You must be very careful while using this
method of CSS insertion as all the style sheet tags
must be declared before the closing tag.
This is done in the following way:
• <style>
• all the styles will go here
• </style>
www.navdeepkumar.comwww.navdeepkumar.com
6. Inline styles
In this case the styles can be placed inside the
individual tag. In the above two cases the styles can be
applied to the whole HTML page but then in this case it
will affect any one particular tag only.
One example of this type of styles insertion follows:
•<style=”color: red; font-size:12px; “ >
www.navdeepkumar.comwww.navdeepkumar.com
7. Advantages of CSS
1. Pages load faster
Less code means faster download times.
2. Easy maintenance
To change the style of an element,
you only have to make an edit in one place.
3. Superior styles to HTML
CSS has a much wider array of attributes than HTML.
www.navdeepkumar.comwww.navdeepkumar.com
8. Disadvantages of CSS
Browser compatibilityBrowser compatibility
Browsers have varying levels of compliance with Style Sheets.
This means that some Style Sheet features are supported and
some aren't. To confuse things more, some browser
manufacturers decide to come up with their own proprietary
tags.
www.navdeepkumar.comwww.navdeepkumar.com