Home > DeveloperSection > Forums > Class in css
Ashish Pandey

Total Post:128

Posted on    December-13-2012 3:35 AM


 1 Reply(s)
 1161  View(s)
Rate this:
Hi Mindstickians

can any one tell me what is class and how to use it in css.

thanks in advance


Total Post:604

Posted on    December-13-2012 6:19 AM

Hi Ashish Pandey

Class is a group of

1) Instances of the same element to which a unique style can be attached or 2) instances of different elements to which the same style can be attached. 1) The rule P {color: red} will display red text in all paragraphs. By classifying the selector P different style can be attached to each class allowing the display of some paragraphs in one style and some other paragraphs in another style.

2) A class can also be specified without associating a specific element to it and then attached to any element which is to be styled in accordance with its declaration. All elements to which a specific class is attached will have the same style. To classify an element add a period to the selector followed by a unique name. The name can contain characters a-z, A-Z, digits 0-9, period, hyphen, escaped characters, Unicode characters 161-255, as well as any Unicode character as a numeric code; however, they cannot start with a dash or a digit. (Note: in HTML the value of the CLASS attribute can contain more characters). (Note: text between /* and */ are my comments). CSS P.name1 {color: red} /* one class of P selector */ P.name2 {color: blue} /* another class of P selector */ .name3 {color: green} /* can be attached to any element */ HTML <P class=name1>This paragraph will be red</P> <P class=name2>This paragraph will be blue</P> <P class=name3>This paragraph will be green</P> <LI class=name3>This list item will be green</LI> It is a good practice to name classes according to their function than their appearance; e.g. P.fotnote and not P.green. In CSS1 only one class can be attached to a selector. CSS2 allows attaching more classes, e.g.: P.name1.name2.name3 {declaration} <P class="name1 name2 name2">this paragraph has three classes attached</P>

I hope this reply solve your doubts

Modified On Dec-13-2012 06:26:42 AM

Don't want to miss updates? Please click the below button!

Follow MindStick