Code source de exo2-7.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Cours R102 - Chapitre 2 - Exercice 7</title>
    <style>
      body {background-color:#DDD;}
      strong { padding: 0 10px; border: 1px solid black; }
      ul > li.premier strong { color: yellow; }
      ul li span strong { color: orange; }
      ul li.premier #sept strong { color: blue; }
      #sept strong { color: red; }
      ul li .impair strong { color: purple; }
      ul li.pair strong { color: white; }
      li strong { color: magenta; }
      li.premier strong { color: chocolate; }
      ul, li, span strong { color: ivory; }
      #trois ul strong { color: teal; }
      ul li span #sept strong { color: pink; }
      #cinq strong { color: silver; }
      #deux strong { color: grey; }
      #deux strong { color: red; }
      #deux { color: green; }
    </style>
  </head>
  <body>
    <ul>
      <li class="impair"><span
      id="un"><strong>1</strong></span></li>
      <li class="pair premier"><span
      id="deux"><strong>2</strong></span></li>
      <li class="impair premier"><span
      id="trois"><strong>3</strong></span></li>
      <li class="pair"><span
      id="quatre"><strong>4</strong></span></li>
      <li class="impair premier"><span
      id="cinq"><strong>5</strong></span></li>
      <li class="pair"><span
      id="six"><strong>6</strong></span></li>
      <li class="impair premier"><span
      id="sept"><strong>7</strong></span></li>
      <li class="pair"><span
      id="huit"><strong>8</strong></span></li>
      <li class="impair"><strong>9</strong></li>
      <!-- attention irrégularité ici -->
      <li class="pair"><span
      id="dix"><strong>10</strong></span></li>
      <li class="impair premier"><span
      id="onze"><strong>11</strong></span></li>
      <li class="pair"><span
      id="douze"><strong>12</strong></span></li>
    </ul>
  </body>
</html>

Lien de téléchargement de exo2-7.html