03_example.html

<!-- 3. Adjacent sibling combinator( + ) : this combinator select adjactly that element which is sibling of sepecific element  -->

<!DOCTYPE html>
<html>
<head>
<title>CSS BY EXAMPLES</title>
<style>
    /* use of adjacent sibling combinator */
div + p{
  background-color: rgb(98, 218, 239);
}
</style>
</head>
<body>

<h2>Adjacent Sibling combinator</h2>

<p>The + combinator is used to select an element that is directly after another specific element.</p>
<p>The following example selects the first p element that are placed immediately after div elements:</p>

<div>
  <p>child 1 in the div.</p>
  <p>child 2 in the div.</p>
</div>

<p>sibling 1 After a div.</p>
<p>sibling 2 After a div.</p>

<div>
  <p>child 1 in the div.</p>
  <p>child 2 in the div.</p>
</div>

<p>sibling 1 After a div.</p>
<p>sibling 2 After a div.</p>

</body>
</html>
<!-- I HOPE YOU UNDERSTAND ALL THESE THINGS -->