Answers for "css combinators"

CSS
3

descendent selector in css

The descendant combinator — typically represented by a single space ( ) 
character — combines two selectors such that elements matched by the second
selector are selected if they have an ancestor 
(parent, parent's parent, parent's parent's parent, etc) 
element matching the first selector. 

example: 
  h1 ul {
    border : 1px solid #f1f1f1;
}
Explanation: This above CSS code snippet will select all the 'ul' (unordered list)
			 tags which are preceeded by an 'h1' (header tag).
/*the best way to understand is to practice by implemetation.
Create a html file with lots of h1 and ul elements to understand by
implementing CSS on them*/
Posted by: Guest on June-05-2020
0

sibling selector css

/*General Sibling*/
/*The general sibling selector selects all elements that are siblings of a specified element.
The following example selects all <p> elements that are siblings of <div> elements: */
/*<div></div>
  <p></p>*/
div ~ p{
}

/*Adjacent Sibling*/
/*The adjacent sibling selector is used to select an element that is directly after another specific element.
Sibling elements must have the same parent element, and "adjacent" means "immediately following".
The following example selects the first <p> element that are placed immediately after <div> elements*/
/*<div><p></p></div>
  */
div + p{
}
Posted by: Guest on December-09-2020
4

css selector for sibling element

/* Paragraphs that come immediately after any image */
img + p {
  font-weight: bold;
}
Posted by: Guest on April-29-2020
0

css combinators

/*Looking inside - Selects all the li elements placed (anywhere) inside the ul;Descendant selector */
ul li

/*Looking inside - Selects only the direct li elements of ul; i.e. it will only select direct children li of ul; Child Selector or Child combinator selector*/
ul > li

/* Looking outside - Selects the ul immediately following the ul; It is not looking inside, but looking outside for the immediately following element; Adjacent Sibling Selector */
ul + ul

/* Looking outside - Selects all the ul which follows the ul doesn't matter where it is, but both ul should be having the same parent; General Sibling Selector */
ul ~ ul
Posted by: Guest on October-18-2021

Browse Popular Code Answers by Language