Comment créer des colonnes via HTML

 Vous avez un blog/site où vous voudrez insérer quelques colonnes afin d'organiser son contenu, vous voulez que votre blog soit plus ergonomique avec des colonnes créées par le langage HTML! Ne vous inquiétez pas, ce dernier vous permet d'insérer une infinité de colonnes, il vous suffit d'avoir une connaissance d'une certaine balise HTML nommée "table", en jouant avec deux balises "table", vous aurez des possibilités illimités pour avoir un superbe blog.


Comment ça se passe alors?:

 Il vous faut pour cela un éditeur HTML (ex: Notepad++), lancez donc ce dernier, sur la barre de navigation du programme, choisissez l'onglet "Fichier" puis cliquez sur "Nouveau" pour ouvrir un document vierge.

Créez maintenant une table, à savoir que la table est définie par la balise "table", chaque table peut être divisée en lignes et chacune de ces dernières en cellules de données, c'est ces dernières qui constituent les colonnes.ainsi le codage HTML d'un tableau à 2 colonnes est le suivant:

<table><tr><td>column1</td><td>column2</td></tr></table>

 Réglez les propriétés de la bordure de la table, si vous souhaitez que les colonnes aient une bordure, placez au minimum la valeur 1 à la balise "border" à l'intérieure de la première balise table. Si vous voulez changer la coloeur de la bordure je vous suggère d'utiliser l'outil en ligne suivant: Color-hex, donnez par exemple la valeur #000000 (noire) à la balise bordercolor. Bordercolor="#000000"

Notre exemple deviendra:

<table border="1" bordercolor="#000000"><tr><td>column1</td><td>column2</td></tr></table>

 Ajoutez de l'espace entre la bordure et le contenu de la cellule par la balise "cellpadding", la balise "cellspacing"ajoute de l’espace entre les cellules, ces deux dernières s'appliquent aussi au sein de la balise "table", les deux balises peuvent être inactives, l'exemple se transforme en:

<table border="1" bordercolor="#000000"cellspacing="1" cellpadding="1"><tr><td>column1</td><td>column2</td></tr></table>

 Insérez un contenu dans les colonnes.Vous pouvez ajouter du texte,des images et des formulaires entre ces deux principales balises "table".Visualisez le résultat via votre navigateur web avant de le transférer sur votre serveur web.

 Vous pouvez aussi tester votre résultat sur des dizaines services en ligne comme LiveGap Editor:

Publier un commentaire