0

Hey Friends iam a novice in css and i just started using it . does any one can explain abt the class selectors and id selectors and when to use them with clear exapmples plz. Thanks in advance.
cheers
Raja

2
Contributors
1
Reply
2
Views
12 Years
Discussion Span
Last Post by tgreer
0

Hello, welcome to the forum. Please do us all the favor of using complete sentences with proper spelling and punctuation. "Abbreviated" speech is strongly discouraged.

An "id selector" will apply to a specific element, the element with that id. They start with a "#" sign.

So in this style declaration, the second paragraph would apply the style.

<html>
<head>
  <title>ID selector</title>
  <style type="text/css">
    #myStyle { letter-spacing: 0.3em }
  </style>
</head>
<body>
   <p id="noStyle">Normal width</p>
   <p id="myStyle">Wide text</p>
</body>
</html>

A class selector on the other hand, is generic, and can be applied to multiple elements of differing types. Class declaractions begin with a ".", and are applied using an element's "class" attribute:

<html>
<head>
  <title>ID selector</title>
  <style type="text/css">
    #myStyle { letter-spacing: 0.3em };
    .greenStyle { color: green };
  </style>
</head>
<body>
   <h1 class="greenStyle">Everything is Green</h1>
   <p id="noStyle" class="greenStyle">Normal width</p>
   <p id="myStyle" class="greenStyle">Wide text</p>
</body>
</html>

Note that ID selectors are more specific in the cascading hierarchy. Thus if the "myStyle" declaration also specified a color, the "myStyle" paragraph would be that color rather than green.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.