Question

IF there is a div say

 <div class="ref"><contents goes here</div>

1. How to specify in the css as body of the div .Meaning

    <style>
    .ref body  {
       /* ref body contents goes here*/
     }
    </style>
   

   Can anything like the above be done?

2. If any one can explain the below also

    <style>
     .a  > .bb
     {
     }
    </style>
   

What does the above mean?

Thanks..

Answer 1

For the first one, it’s not totally clear what you mean. Just using .ref { /* CSS here */ } will target that div element. If you mean adding content via CSS, it’s only possible using the :before and :after pseudo slectors:

.ref:after {
  content: "Some text";
}

Note: you can’t put HTML in there, only text.

---

For the second one, it looks for all elements with a class of bb that are direct children of class a. For example, it will match the p in this code

<div class="a">
  <div>something</div>
  <p class="bb">class bb</p>
</div>

But it won’t match this:

<div class="a">
  <div>
      <p class="bb">class bb</p>
  </div>
</div>