DEV Community

Cover image for CSS Selectors for Web developer
Md. Injamul Alam
Md. Injamul Alam

Posted on

CSS Selectors for Web developer

CSS selectors

1 Element Selector

h3 {
    /* write your css */ 
}
Enter fullscreen mode Exit fullscreen mode

2 Id Selector

#head {
    /* write your css */ 
}
Enter fullscreen mode Exit fullscreen mode

3 Class Selector

.head-title {
    /* write your css */ 
}
Enter fullscreen mode Exit fullscreen mode

4 Attribute Selector

ol[type="a"] {
  /* write your css */ 
}
Enter fullscreen mode Exit fullscreen mode

5 Descendant Selector

div .card-title {
   /* write your css */ 
}
Enter fullscreen mode Exit fullscreen mode

6 Universal Selectors

* {
  /* write your css */ 
}
Enter fullscreen mode Exit fullscreen mode

7 Nth type of Selector

div:nth-of-type(2) {
  /* write your css */ 
}
Enter fullscreen mode Exit fullscreen mode

8 Pseudo-class Selector

*The syntax of pseudo-class:*
selector:pseudo-class {
  property: value;
}
Enter fullscreen mode Exit fullscreen mode

Example:

a:hover {
  /* write your css */
}

Enter fullscreen mode Exit fullscreen mode

Top comments (0)