Thursday 21 March 2013

Cascading Style Sheet (CSS)

CSS is recommended to design the layout of the page including position of the element, appearance of the element n HTML. CSS can  be specified as inline CSS, Internal CSS and External CSS.
  • Inline CSS : Specifying a CSS style by string style attribute of HTML elements without defining it separately is called as Inline CSS. 
Eg: The following example changes font and color of the heading level h1 using Inline CSS.

<!doctype html>
<html>
<body>
<h1 style= "font-family:arial black; color:blue">
Inforica Pvt lmd
</h1>
</body>
</html>
  • Internal CSS : When CSS styles are defined within the head section then it is called as Internal CSS. While defining CSS in the head section. CSS style will have three main parts- Selector, Property and Value. Selector is used to specify the HTML element for which you are defining the style. property is used to specify the CSS property you want to set and value is used to specify the value for CSS property. Property and its value must be separated by colon and multiple properties must be separated by semicolon.
Eg: The following example defines styles for the elements h1 and h2 as internal CSS.

<!doctype html>
<html>
<head>
<style type = "text/CSS">
<h1>
{
font-family:arial black; color:blue"
}
<h2>
{
font-family:times new roman; color:red"
}
</style>
</head>
<body>
<h1> Inforica Pvt lmt </h1>
<h2> Inforica Pvt lmt </h2>
<h1> Inforica Pvt lmt </h1>
<h1> Inforica Pvt lmt </h1>
</body>
</html>
  • External CSS : Defining the CSS styles in seperate files with extention .CSS is called as external CSS. Advantages of external CSS is that they can be used in any HTM document. To add the reference the External CSS file use style element with src attributes or the link element withen the head section.
Syntax:  <style src = "Filename.css">
             <link rel = "stylesheet" type="text/css">
             href="Filename.css"


No comments:

Post a Comment