Exercice intermédiaire en HTML

Bonjour à tous la communauté ! :wave:
Voici ma version de l’exercice intermédiaire en HTML . Dites-moi ce que vous en pensez, voici le code source de la page :

<!DOCTYPE html>
<html lang="fr">
  <!-- * Basic page elements-->
  <head>
    <title>Calculatrice en ligne</title>
    <meta charset="utf-8" />
    <link rel="shorcut icon" href="img/favicone.jpg" type="image/x-icon" />
    <!-- ? SEO-->
    <meta name="author" content="Maxence" />
    <meta
      name="description"
      content="Calculatrice en ligne utilisable pour des calculs simples."
    />
  </head>

  <!-- * Body of the page-->
  <body>
    <!-- Page header-->
    <header>
      <h1>Calculatrice en ligne</h1>
      <p>
        Utilisez la <strong>calculatrice</strong> comme bon vous semble autant
        de fois que vous le voulez. Elle est utilisable pour des
        <mark>calculs simples</mark>.
      </p>
    </header>

    <!-- * Main element of the page-->
    <section>
      <h2>Utilisez la calculatrice ! 🔽</h2>
      <!-- TODO Calculator-->
      <table>
        <!-- Calculator header-->
        <thead>
          <tr>
            <th colspan="5">Écran de la calculatrice</th>
          </tr>
        </thead>

        <!-- Calculator body-->
        <!-- ? M1 - M2-->
        <tr>
          <td></td>
          <td>
            <button
              type="button"
              style="background-color: red; font-size: 17px"
            >
              M1
            </button>
          </td>
          <td colspan="2">
            <button
              type="button"
              style="background-color: blue; font-size: 17px"
            >
              M2
            </button>
          </td>
          <td></td>
        </tr>

        <!-- ? Signes quelconques-->
        <tr>
          <td><button type="button">√</button></td>
          <td><button type="button">π</button></td>
          <td><button type="button">%</button></td>
          <td><button type="button">,</button></td>
          <td><button type="button">÷</button></td>
        </tr>

        <!-- ? Signes quelconques & chiffres-->
        <tr>
          <td><button type="button">M-</button></td>
          <th><button type="button">7</button></th>
          <th><button type="button">8</button></th>
          <th><button type="button">9</button></th>
          <td><button type="button">x</button></td>
        </tr>
        <tr>
          <td><button type="button">M+</button></td>
          <th><button type="button">4</button></th>
          <th><button type="button">5</button></th>
          <th><button type="button">6</button></th>
          <td><button type="button">-</button></td>
        </tr>
        <tr>
          <th><button type="button">0</button></th>
          <th><button type="button">1</button></th>
          <th><button type="button">2</button></th>
          <th><button type="button">3</button></th>
          <td><button type="button">+</button></td>
        </tr>
        <tr>
          <td colspan="3"></td>
          <td colspan="2"><button type="button">=</button></td>
        </tr>
      </table>
    </section>
  </body>
</html>

:pushpin: PS : Ne prenez pas en compte de ce qui est marqué dans les commentaires, parfois, il y a « TODO », c’est pour moi, ne vous inquiétez pas !

Bonjour Maxence
Par curiosité, j’ai été voir ton Post mais je souhaite savoir qu’elle est l’objectif de ta question ? Est ce que tu souhaites que l’on juge la qualité de code HTML par rapport au rendu à obtenir ? si oui peux tu m’envoyer le rendu à obtenir …
A suivre

Hello @Fredinho :wave:

Je post mon code par rapport au guide d’Alexis, à chaque fin d’apprentissage théorique d’un langage de programmation (dans mon cas, il s’agit de l’HTML), on doit réaliser 3 exercices, le premier étant le plus simple et le troisième étant le plus compliqué. Dans mon cas, il s’agit du deuxième exercice.

Je souhaiterais en effet que vous « jugiez », plutôt donner des conseils sur mon code, qu’est ce qui est à améliorer, qu’est ce qui est à modifier.

Voici l’intitulé de l’exercice ainsi que les contraintes (voir photo).


Ok pardon, autant pour moi, je n’avais pas fait attention.

Perso : la première chose que je ferais si je peux me permettre de faire une remarque sur ton code, c’est de ne pas utiliser un tableau pour dessiner une calcultrice. je partirai plutot sur une GRID. Le tout contenu dans une div #calculatrice

CE serait ma principale remarque
Mais il existe tellement de manière de faire …
C’est uen suggestion uniquement

1 « J'aime »