bookmanu
6
Q:

how to use child selectors in css

/* Answer to: "css child selector" */

/*
  Child Selector is used to match all the elements which are child
  of a specified element. It gives the relation between two
  elements. The element > element selector selects those elements
  which are the children of specific parent.

  The operand on the left side of > is the parent and the operand on
  the right is the children element.
*/

#idOfParentElement > .classOfChildElement {
  /* Your CSS Properties for the child element */
}

/* If you want to get all child elements of the parent, use "*" */

.classOfParentElement > * {
  /* Your CSS Properties for the child elements */
}

/* If you want to get all <span> elements of the parent, use "span" */

body > span {
  /* Your CSS Properties for the child elements */
}
3
/*
	Descendant selectors are used to match to any nested element. 
	Child combinators, on the other hand, only match to the direct 
	child element and are defined by the greater than symbol. 
	The selector on the right must be the direct child of the element 
	on the left.
*/
/* child combinator */ 
  parent > child {...}

/* descendant selector */ 
  parent child {...}
  ancestor descendant {...}
0
ul li { margin: 0 0 5px 0; }
ul > li { margin: 0 0 5px 0; }
0

New to Communities?

Join the community