Les tableaux dans Dreamweaver

Name: Les tableaux dans Dreamweaver
Author: Patti Scully-Lane

Alors que HTML fournit la structure, CSS fournit la beauté. Dans ce module, vous vous familiariserez avec ce qu’est CSS, comment les différents styles se…

Preview the first lesson free — get full access to all 4 lessons.

Demander une démo Se connecter

Cours : à la demande

Dans cette leçon, vous allez apprendre comment créer un tableau dans Adobe Dreamweaver. Avant de pouvoir travailler sur notre table, nous devons créer un site dans Dreamweaver. Nous allons donc aller dans le menu Site, vers Nouveau site. Nous allons nommer cela Travailler avec des tableaux, et nous allons cliquer sur l'icône du dossier. Maintenant, j'ai pris le dossier des fichiers de cours de ce Module3, et je les ai mis sur mon bureau. Je vais donc sélectionner ce Module3_tables et sélectionnez ce dossier, et nous allons cliquer sur le bouton Enregistrer. Si vous avez besoin d'en savoir un peu plus sur l'utilisation de sites dans Dreamweaver, vous pouvez revenir au module 1 et aux sites de gestion de cours dans Dreamweaver pour en savoir un peu plus pourquoi nous travaillons avec des sites dans Dreamweaver. Je vais passer au panneau Fichiers, et je vais double-cliquer sur randonnées.html. Cela ouvrira ce fichier dans notre fenêtre principale. Nous allons utiliser une table comme un véritable tableau dans ce document. Cependant, il est important de noter qu'au début de la conception pour Internet, les tables ont été utilisées comme éléments de conception avant CSS, feuilles de style en cascade, et ils sont encore utilisés aujourd'hui en tant qu'éléments de conception dans les e-mails HTML. J'ai maintenant la vue Conception sélectionnée dans mes modes d'affichage. Donc, si vous avez sélectionné la vue en direct, Je vais vous demander de monter et de sélectionner Design. Et nous allons mettre notre curseur dans cette case ici sur la gauche, et nous allons taper dans SENTIERS DE RANDONNÉE, puis appuyez sur la touche Entrée. Maintenant, pour ajouter une table, nous allons monter dans le menu Insertion vers Tableau. La boîte de dialogue du tableau s'affiche, et nous allons créer un tableau avec trois lignes et deux colonnes. Nous allons avoir une largeur de tableau de 300 pixels avec une épaisseur de bordure de un. Maintenant, si nous le voulions, nous pourrions choisir d'avoir soit une colonne d'en-tête, soit une ligne d'en-tête, soit les deux, mais nous allons laisser cela comme aucun, et nous allons cliquer sur OK. Dans Dreamweaver, le moyen le plus simple d'apporter des modifications à votre table se trouve ici dans le panneau Propriétés. Donc on va changer la largeur du tableau de 300 à 600, et vous pouvez voir comment cela s'intègre bien dans ce domaine. Nous allons aller là où il est écrit Aligner. Nous allons changer cela de Default à Center, donc ça va bien le centrer dans notre région. Et nous allons taper dans cette rangée du haut des sentiers de randonnée dans le MA. Et, maintenant, pour passer à la section suivante, tout ce que nous avons à faire est de cliquer sur la touche de tabulation, et vous pouvez voir que cela change notre table juste un peu. Et c'est important de savoir que lorsque vous concevez des tables il y a certaines choses qui en font une table fluide. Et, donc, cela changera au fur et à mesure que nous mettrons des informations dans nos cellules. Je vais appuyer sur la touche de tabulation une fois de plus, et je vais taper le nom du sentier, et touche de tabulation et tapez Ville. Donc, vous pouvez voir, comme je l'ai mis en ville mes colonnes changent un peu plus. Maintenant que nous avons un peu plus d'informations dans notre tableau Je veux revenir en arrière et apporter quelques modifications supplémentaires à la table. Alors on va cliquer sur ce 600 en haut de notre table et sélectionnez notre table, et cela nous permet d'apporter notre panneau Propriétés pour notre table de nouveau. Et nous allons parler du rembourrage des cellules et l'espacement des cellules de notre table. Si vous ne mettez pas de numéro dans votre rembourrage de cellule et votre espacement de cellule, par défaut HTML va mettre un pixel de rembourrage dans chacun. Le rembourrage des cellules est la quantité d'espace entre le bord de la cellule et le contenu. Donc, si nous mettons 10 comme remplissage de cellule et appuyons sur la touche Entrée, vous pouvez voir comment maintenant notre type est un peu plus éloigné du bord de nos cellules. Espacement des cellules, je vais juste en mettre cinq pour l'instant, est la quantité d'espace entre les cellules elles-mêmes. Donc je vais supprimer ça et appuyer sur la touche entrée et laissez-le comme paramètre par défaut. Maintenant, l'autre propriété que nous avons car notre table est la frontière. Actuellement, nous avons une frontière d'un, mais vous pouvez voir si nous mettons une bordure de zéro, Dreamweaver, en mode Création, nous montrera les bords de notre table. Mais si nous allons à la vue en direct vous pouvez voir comment nous ne voyons pas du tout la bordure du tableau. Je vais remettre ça en mode Design parce que le mode Création nous aide à travailler beaucoup plus efficacement lorsque vous travaillez avec des tableaux. Dans les prochaines leçons, nous en apprendrons davantage sur la modification et formater nos cellules. Ainsi, dans cette leçon, vous avez appris à créer un tableau dans Adobe Dreamweaver.

Intermédiaire Fournisseur : Patti Scully-Lane 4 leçons · 30m en Arabe, Allemand, Anglais, Espagnol, Français, Portugais, Ourdou, Chinese

Description du cours

Alors que HTML fournit la structure, CSS fournit la beauté. Dans ce module, vous vous familiariserez avec ce qu’est CSS, comment les différents styles se cascadent et quels éléments HTML peuvent être stylisés.

Objectifs de la formation :

Ce que vous allez apprendre

Comprendre les niveaux de CSS et la syntaxe CSS
Créer des tableaux dans Dreamweaver
Modifier les lignes et les colonnes des tableaux
Formater les lignes et les colonnes des tableaux
Reconnaître les styles externes par rapport aux styles internes
Importer des données tabulaires dans un tableau

Points clés à retenir

Le HTML fournit la structure d'une page tandis que le CSS fournit le style.
Les styles CSS se superposent sur différents niveaux, et les éléments HTML peuvent être stylisés à l'aide du CSS.
Ce module couvre la création de tableaux et la modification et le formatage de leurs colonnes et de leurs lignes.
Le cours fait la distinction entre les styles externes et internes en CSS.
Les apprenants peuvent importer des données tabulaires directement dans un tableau.

Foire aux questions

Que couvre ce cours ?

Ce module couvre ce qu'est le CSS, comment les différents styles se superposent et quels éléments HTML peuvent être stylisés. Il vous apprend également à créer des tableaux, à formater et modifier des colonnes et des lignes, à reconnaître les styles externes par rapport aux styles internes et à importer des données tabulaires dans un tableau.

Quelles compétences vais-je acquérir grâce à ce cours ?

Vous développerez des compétences dans Adobe Dreamweaver, les frameworks CSS, les composants HTML, le formatage HTML, les tableaux HTML et le CSS orienté objet.

Quelles leçons sont incluses dans ce cours ?

Les leçons sont : Créer un tableau, Modifier les lignes et les colonnes des tableaux, Formater les lignes et les colonnes des tableaux, et Importer des données tabulaires dans un tableau.

Quelle est la différence entre le HTML et le CSS tel qu'enseigné dans ce cours ?

Selon le cours, le HTML fournit la structure tandis que le CSS fournit la beauté, ce qui signifie que le CSS est utilisé pour styliser les éléments HTML.