descendant selector [space]

It selects all elements that are descendants of a specified element

/*Syntax*/

library_booksspecified_Selector select_Selector{
  /*css properties*/
}

*descendant: can be child, grand-child, grand-grandchild and so on

library_booksdiv p {
  background-color:lightgreen;
  border:2px solid red;
}

library_books#test p {
  background-color:lightgreen;
  border:2px solid blue;
}

child selector [>]

It selects all elements that are the direct child of a specified element

/*Syntax*/

library_booksspecified_Selector > select_Selector{
  /*css properties*/
}

library_booksdiv > p {
  background-color:lightgreen;
  border:2px solid red;
}

library_books#test > p {
  background-color:lightgreen;
  border:2px solid blue;
}

adjacent sibling selector [+]

It selects all elements that are placed immediately after a specified element

/*Syntax*/

library_booksspecified_Selector + select_Selector{
  /*css properties*/
}

library_booksdiv + p {
  background-color:lightgreen;
  border:2px solid red;
}

library_books#test + p {
  background-color:lightgreen;
  border:2px solid blue;
}

general sibling selector [~]

It selects all elements that are siblings of a specified element and declared after it

/*Syntax*/

library_booksspecified_Selector ~ select_Selector{
  /*css properties*/
}

*siblings: Sharing same parent

library_booksdiv ~ p {
  background-color:lightgreen;
  border:2px solid red;
}

library_books#test ~ p {
  background-color:lightgreen;
  border:2px solid blue;
}