Learn CSS selectors and XPath

Select a type of selector:

Who am I?

I'm 34 and measure 1.70m.

What I like:

  • Barcelona
  • winning the Ballon d'Or every odd year

I forgot to say that I like scoring over 100 goals per season.

What I don't like:

  • Real Madrid
  • leaving the club in which I've played since 13

Well known fact

If you own a football jersey, my name is the most likely on your back.

Quotes of mine

It doesn't matter if I am better than Cristiano Ronaldo, all that matters is that Barcelona are better than Madrid.

I start early and I stay late, day after day, year after year. It took me 17 years and 114 days to become an overnight success.


<h2>Who am I?</h2>

<div class="intro">
  <p>I'm <span class="age">34</span> and 
    measure <span class="unit">1.70m</span>.</p>
</div>

<div class="info">
  <div>
    <p id="like">What I like:</p>
    <ul>
      <li>Barcelona</li>
      <li>winning the Ballon d'Or every odd year</li>
    </ul>
    <p class="extra">I forgot to say that I like scoring over 100 goals per season.</p>
  </div>

  <div>
    <p class="dislike">What I don't like:</p>
    <ul>
      <li><span class="deadly-foe">Real Madrid</span></li>
      <li>leaving the club in which I've played since <span class="age">13</span></li>
    </ul>
  </div>
</div>

<div class="fact">
  <h4>Well known fact</h4>
  <p>If you own a football jersey, my name is the most likely on your back.</p>
  <div class="fact extra">
      <h4>Quotes of mine</h4>
      <p><q>It doesn't matter if I am better than Cristiano Ronaldo, all that matters is that Barcelona are better than <span class="deadly-foe">Madrid</span>.</q></p>
      <p><q>I start early and I stay late, day after day, year after year. It took me 17 years and 114 days to become an overnight success.</q></p>
  </div>
</div>