In today's post, we'll discuss External Styles of web page. i.e How do we use External Style Sheets.
(3) External Styles
In this technique, we define all CSS rules in a style sheet file (extension .css) and then give reference to that css file in web page. The advantage of using this technique is, re-usability of CSS rules and making style consistent on all the pages. If we use this technique, we don't need to define Embedded Styles or Inline Styles.
Link tag is used in Head section, that refers to an external style sheet (reference to CSS file)
<head>
<link type="text/css" rel="stylesheet" href="style.css">
</head>
href: contains CSS path.
Example for 2 web pages: Suppose we define two web pages and one CSS
Comparison:
Inline Styles: are used to define rule within tag using its style properly, specifically for that tag within web page.
Embedded Style: are used to make presentation of the web page consistent for defined Selectors within web page, i.e consistency between same tags.
External Styles: are used to apply consistent look on more then one pages, and all the styling rules are defined in a separate file with extension (.css)
(3) External Styles
In this technique, we define all CSS rules in a style sheet file (extension .css) and then give reference to that css file in web page. The advantage of using this technique is, re-usability of CSS rules and making style consistent on all the pages. If we use this technique, we don't need to define Embedded Styles or Inline Styles.
Link tag is used in Head section, that refers to an external style sheet (reference to CSS file)
<head>
<link type="text/css" rel="stylesheet" href="style.css">
</head>
href: contains CSS path.
Example for 2 web pages: Suppose we define two web pages and one CSS
Comparison:
Inline Styles: are used to define rule within tag using its style properly, specifically for that tag within web page.
Embedded Style: are used to make presentation of the web page consistent for defined Selectors within web page, i.e consistency between same tags.
External Styles: are used to apply consistent look on more then one pages, and all the styling rules are defined in a separate file with extension (.css)
Your blog has given me that thing which I never expect to get from all over the websites. Nice post guys!
ReplyDelete