Basic Fundamentals of Cascading Style or CSS by RituparnoSonowal


Rituparna sonowal
Cascading Style Sheet, from the name itself you can understand that it is somewhere
related to style. yes, it is true. Css is responsible for the styling of webpages. you can
referred it as the bread and butter of modern webdesign. Only because of css it is
become very easy to design complex page layouts. Html by itself never able to add a
sophisticated design to a website. Css performs this job for html. Essentially , a css
style is just a rule that tells the web browser how to display a particular element on a
page. For example:
you can create a css rule to display all text within a <p> tag in Georgia font with font
size of 18 pixels and in blue color. For that you have write following css rule:

 p{font-size: 18px;
 font-family: Georgia, "Times New Roman",
 Times, Serif;
 color: blue;}
A css rule is made of two main parts. they are:

1. Selector
2. Declaration block

Declaration block can contain one or more than one declarations. each
declaration ends with a semi-colon. again each declaration is divided into two
parts.they are:

1. Property
2. value
Selector: Selector or the the first part of a css rule tells the web browser
which element or elements on a webpage to style. those elements may be a
headline, a paragraph or may be a link. In the above given figure p refers to the
<p> tag and this style rule format everything within that <p> tag as the direction
given in the declaration block.

Declaration block: This block starts with opening brace({) and ends
with a closing brace(}). it contains all formatting options which are applied to a

Declaration: Everything between the opening and closing braces in the
css rule are referred as declaration. you can add valid declarations as many as you
want. valid declaration means you can not add declaration like this:

p{color: 10px; font-size: blue;}

and this is invalid declaration. Every declaration is separated by semi-colon.
Property: Css offers a wide range of formatting options and they are know
as css property. css properties are nothing but some meaning-full words such as
background-color, color, font-size, font-family, margin, padding etc. It is not
possible to mention all css properties here. The properties that i have mentioned
above are just a few of them.

Value: Different css properties require specific types of values. such as
property "color" need a value like "red, green or #ffffff". here color property can
be specify by the color name or by hex value. In the latest Css version color
property can be specify in RGB or RGBA or hsl or hsla.

Thats all guys. Thanks

To top