Et oui ! Bon on va styliser un peu ça avec le css du coup !
Dans Notepad, tu ouvres un nouveau fichier, colles le code de ton tableau en html dedans.
Enregistre sous (sur ton ordi, un endroit comme le bureau ou le dossier codage)
et après cherche le sur ton bureau par exemple, clique 2x sur le logo google et ouvre le dans le navigateur.
Ensuite css.
Ouvre un new fichier dans Notepad ++, tu vas en haut dans LANGUAGE > C > CSS
tu cliques sur css (tu touches pas encodage si c'est déjà sur utf-8 sans bom
)
Ensuite dans ce dossier on va lier l'html au css avec ce code essentiel partout:
- Code:
-
<link rel="stylesheet" href="style.css" />
tu mets donc ce code pour l'html:
- Code:
-
<DOCTYPE!html>
<html>
<head>
<meta-charset="UTF-8">
</head>
<body><link rel="stylesheet" href="style.css" />
<Table>
<tr>
<th> Nom </th>
<th> Age </th>
<th> Taille </th>
</tr>
<tr>
<td> Tom </td>
<td> 15 ans </td>
<td> 1m70 </td>
</tr>
<tr>
<td> Marie </td>
<td> 12 ans </td>
<td> 1m50 </td>
</tr>
</table>
</body>
</html>
Puis à la suite tu fais entrée et met ce code, j'ai mis des commentaires pour t'expliquer comment c'est, tu peux les enlever si ça te gêne je t'ai donné le code sans eux dessous:
- Code:
-
td /* Toutes les cellules des tableaux... */
{
border: 1px solid black; /* auront une bordure de 1px */
}
- Code:
-
td
{
border: 1px solid black;
}
Tu enregistres ton css, tu l'appelles style.css et normalement le format est déjà mis en css, vérifie quand même (comme là où tu enregistres un créa' photoshop tu peux choisir jpeg png gif etc, c'est là!)
Donc du coup tu pourras pas visualiser la bordure ici, que sur un forum ou navigateur !
Ce qui donne: