7: Exercice : tableau

Transformez le programme précédent pour rajouter les éléments suivants :

  • Un appel dans l'entête à un fichier CSS (par exemple style.css)
  • Le titre doit comporter le nom de l'équipe (Composition de l'équipe du PSG)
  • La présentation doit être faite sous forme de tableau à trois colonnes : numéro du joueur dans la liste, nom du joueur, poste occupé.
  • Chaque cellule aura une couleur qui sera assignée en fonction du poste du joueur de la ligne

Tableau des joueurs (objectif à atteindre)

Vous créerez (une fois pour toutes) le fichier CSS en mettant le contenu suivant :

table, th, td {
  border: 1px solid black;
}
table {
  border-collapse: collapse;
  border: 2px;
}
.milieu_offensif {
    background: #8080FF;
}
.milieu_de_terrain {
    background: #4040FF;
    color: white;
}
.défenseur {
    background: #0000C0;
    color: white;
}
.gardien {
    background: #000080;
    color: white;
}
.attaquant {
    background: #C0C0FF;
}

Vous pourrez avoir besoin de la méthode python mystring.replace(" ", "_") qui remplace un caractère par un autre.

Bien sûr, vous vérifierez à chaque étape que le résultat produit par votre programme est correct visuellement et valide (au sens validateur HTML). Vous vérifierez aussi que le changement des données par celles de l'ASM fonctionne aussi.