Comment créer une table en html

Thisteach vous comment créer une table d`informations de base à l`aide de HTML, ainsi que comment ajouter des éléments utiles tels que les frontières à la table.

Pas

Partie 1 de 2:
Créer une table
  1. Image intitulée Créer une table dans HTML Étape 1
1. Ouvrir un programme de modification de texte. Vous utiliserez généralement NotePad ++ sur Windows et TextEdit sur Mac. Pour trouver ces programmes:
  • les fenêtres - Ouvert Démarrer
Image intitulée windowsstart.jpg
, taper bloc-notes au début, puis cliquez sur Bloc-notes en haut de la fenêtre.
  • Mac - Ouvert Projecteur
    Image intitulée MacSpotlight.jpg
    , tapez texte, et cliquez sur Texte en dessous du champ de recherche des projecteurs.
  • Image intitulée Créer une table dans HTML STEP 2
    2. Tapez et appuyez sur ↵ Entrez. Thetag indique le début d`une table et appuyez sur ↵ Entrer invite votre éditeur de texte pour lancer une nouvelle ligne.
  • Lorsque vous utilisez HTML, vous devez toujours appuyer sur ↵ Entrée après avoir créé une ligne de code pour vous déplacer sur la ligne suivante.
  • Image intitulée Créer une table dans HTML Étape 3
    3. Tapez et appuyez sur ↵ Entrez. Cette commande indique que vous créerez un élément spécifique de la table.
  • Image intitulée Créer une table dans HTML Étape 4
    4. Ajouter une colonne à votre table. Tapez pour indiquer une colonne, tapez l`étiquette de la colonne, tapez pour fermer la colonne et appuyez sur ↵ Entrée.
  • Par exemple: créer une colonne de table marquée "Nombre de chiens", Vous voulez taper Nombre de chiens dans votre éditeur de texte.
  • Image intitulée Créer une table dans HTML Étape 5
    5. Ajouter plus de colonnes. En fonction du nombre de colonnes que vous voulez que votre table ait, cette étape varie. Une fois que vous avez ajouté toutes les colonnes que vous souhaitez utiliser, passez à l`étape suivante.
  • Les colonnes sont créées de gauche à droite.
  • Image intitulée Créer une table dans HTML Étape 6
    6. Tapez et appuyez sur ↵ Entrez. Cette commande indique que toutes les colonnes de la table ont été créées et ferme cette section du code de la table.
  • Image intitulée Créer une table dans HTML Step 7
    7. Tapez à nouveau, puis appuyez sur ↵ Entrez. Vous allez maintenant ajouter vos lignes à votre table.
  • Image intitulée Créer une table dans HTML STEP 8
    8. Ajouter une cellule à votre table. Tapez pour indiquer une pièce d`informations sous la première colonne, tapez les informations, tapez pour fermer la cellule et appuyez sur ↵ Entrée.
  • Par exemple: créer une cellule avec le nombre "23" En cela, vous tapez 23 dans votre éditeur de texte.
  • Image intitulée Créer une table dans HTML Étape 9
    9. Ajouter plus de cellules à votre table. Le nombre de cellules d`une rangée doit être corrélé au nombre de colonnes, par exemple, si vous avez trois colonnes, vous devez avoir trois cellules d`affilée. Une fois que vous avez créé une ligne entière, vous pouvez continuer.
  • Image intitulée Créer une table dans HTML Étape 10
    dix. Fermez la ligne actuelle. Tapez et appuyez sur ↵ Entrer pour fermer la ligne. À ce stade, vous pouvez ouvrir une autre ligne en tapant et en appuyant sur ↵ Entrer, en ajoutant des cellules individuelles, puis fermez la ligne.
  • Image intitulée Créer une table dans HTML Étape 11
    11. Fermez votre table. Sous la ligne finale de la table, tapez . Cela indique la fin de la table.
  • Image intitulée Créer une table dans HTML Step 12
    12. Passez en revue votre table. Votre table devrait ressembler à quelque chose comme ceci:
  • Jour
  • Mois
  • An
  • 4
  • Mars
  • 1990
  • 27
  • juillet
  • 1993
  • Image intitulée Créer une table dans HTML Étape 13
    13. Sauvez votre travail. presse Ctrl+S (Windows) ou commande+S (Mac) Pour enregistrer votre document, entrez un nom pour le document et cliquez sur Sauvegarder quand invité.
    • Partie 2 de 2:
    Ajouter des modificateurs de table
    1. Image intitulée Créer une table dans HTML Step 14
    1. Élargissez votre table. Remplacer thetag en haut de la feuille avec puis tapez
     Style ="Largeur: 100%"> dans la balise. Assurez-vous de garder un espace entre "tableau" et "style".
    • Le résultat final devrait ressembler à ceci:
    • Vous pouvez expérimenter avec le pourcentage. Par exemple, en tapant dans 50 à la place de 100 entraînera une table à moitié à l`échelle.
  • Image intitulée Créer une table dans HTML Étape 15
    2. Créer des frontières pour votre table. Créez un espace au même sommet du document ci-dessus Thetag, puis procédez comme suit:
  • Tapez et appuyez sur ↵ Entrée.
  • Tapez table, th, td { et appuyez sur ↵ Entrer.
  • Tapez frontière: 1px noir solide- et appuyez sur ↵ Entrer.
  • Tapez frontière-effondrement: effondrement- et appuyez sur ↵ Entrer. Ignorez cette ligne si vous voulez que vos frontières aient deux lignes au lieu d`un.
  • Tapez } et appuyez sur ↵ Entrer.
  • Tapez et appuyez sur ↵ Entrée.
  • Image intitulée Créer une table dans HTML Step 16
    3. Ajouter une étiquette pour votre table. Créez un espace juste en dessous de thetag, puis procédez comme suit:
  • Tapez
  • Tapez le texte que vous souhaitez utiliser (e.g., Anniversaire)
  • Tapez et appuyez sur ↵ Entrée.
  • Votre résultat final devrait ressembler à ceci: Anniversaires

    • Conseils

    Il aide à orner des sections de code associées afin que vous puissiez les référencer facilement plus tard. Par exemple, vous pourriez indenter une section entière de cellules.
  • Pour faire un certain texte audacieux, vous pouvez placer des balises autour du texte en question. Par exemple, pour tourner "Nombre d`années" dans "Nombre d`années", tu taches Nombre d`années dans l`éditeur de texte.

    • Mises en garde

    Rappelez-vous toujours de fermer les commandes.
    Articles connexes