visitor activity monitorvisitor activity monitor


                                            The Developers Choice!!!!
                                                                                                            Home | About Us | Contact Us



What is CSS Selectors
A CSS selector is the part of a CSS rule set that actually selects the content you want to style. Let’s look at all the different kinds of
Types of CSS Selectors
  • The Element Selector
  • The Id Selector
  • The Class Selector
  • Grouping Selector
What is Element Selector
The element selector selects elements based on the element name.
How to use Element Selector
You can select all elements on a page like this:
(all elements will be left-aligned, with a blue text color)
How to implement Element Selector
p {
text-align: left;
color: blue;
What is Id Selector

The id selector uses the id attribute of an HTML tag to find the specific element. An id should be unique within a page, so you should use the id selector when you want to find a single, unique element. To find an element with a specific id, write a hash character, followed by the id of the element.

How to use Id Selector

write a hash character, followed by the id of the element.
<p id="bordered">
<div id="Div1">
#bordered {
border : 1px solid black ;
div#bordered {
border : 2px solid red ;

How to implement Id Selector

The style rule below will be applied to the HTML element with id="para1":
#para1 {
text-align: left;
color: blue;

What is Class Selector

The class selector finds elements with the specific class. In the CSS, a class selector is a name preceded by a full stop (“.”) and an ID selector is a name preceded by a hash character (“#”).
The difference between an ID and a class is that an ID can be used to identify one element, whereas a class can be used to identify more than one.

How to use Class Selector

We can use class selector like this
.left {
text-align: left;
color: red;

How to implement Class Selector

In the example below, all HTML elements with class="left" will be left-aligned:
.left {
text-align: left;
color: red;

What is Grouping Selector

Grouping Selectors are used to "select" the elements on an HTML page that are affected by rules.
When several selectors share the same declarations, they may be grouped together to save writing the same rule more than once.

How to use Grouping Selector

Each selector must be separated by a comma.
h1, h2, h3, h4 { padding: 1em; }

How to implement Grouping Selector

. To group selectors, separate each selector with a comma. In the example below we have grouped the selectors from the code above:
h1, h2, p {
text-align: center;
color: green;

All Rights Reserved with Project code