> and ~ expressions in CSS

Your selector means:

Select any element
it is a child with a class content
that follows a label
which, in turn, follows the input element :checked.

> - this . It selects elements that are children of a specific parent element. Unlike space (child combinator), it selects only immediately nested elements. See this answer for an illustration of how it works.

~ - . , (.. ). + ( ), , . , +.

, ~ - . , , :checked ~ label label, .

:

<section>
    <input type="radio" name="example1" value="1" checked>
    <label>1</label>
    <input type="radio" name="example1" value="2">
    <label>2</label>
    <input type="radio" name="example1" value="3">
    <label>3</label>

    <div class="content">
        <h3>Subheading 1</h3>     <!-- [1] Selected -->
        <p>Some text              <!-- [1] Selected -->
           <em>with emphasis</em> <!-- [2] Not selected -->
        </p>
        <p>Some text</p>          <!-- [1] Selected -->
    </div>
</section>

<section>
    <input type="radio" name="example2" value="1">
    <label>1</label>
    <input type="radio" name="example2" value="2">
    <label>2</label>
    <input type="radio" name="example2" value="3">
    <label>3</label>

    <div class="content">
        <h3>Subheading 1</h3>     <!-- [3] Not selected -->
        <p>Some text              <!-- [3] Not selected -->
           <em>with emphasis</em> <!-- [2] Not selected -->
        </p>
        <p>Some text</p>          <!-- [3] Not selected -->
    </div>
</section>

, :

• Selected
  h3 p .content. .content label, label , :checked.

  , , , , , ~ , . , ~ +:

  :checked + label ~ .content > *
  :checked ~ label + .content > *
  

  :

  :checked + label + .content > *
  

  , , , label .content.

• 
  em p, .content. , .content.

• 
  [1], label :checked. , :checked ~ label.