Plan de la prsentation Le langage HTML Dreamweaver
- Slides: 22
Plan de la présentation Le langage HTML Dreamweaver MX Les premiers outils pour créer une page web : Propriétés d’une page Création de cadres Création d’un tableau Formatage du texte Création d’un lien Mettre des images
Le langage HTML Définitions – HTML : Hyper Text Markup Language (Langage de mise en forme de documents hypertextes) – Hypertexte : Texte qui contient des références croisées
Le langage HTML Langage structurée à l’aide de balises Les balises de structure <TITLE>…</TITLE> : balise titre, <P>…</P> : balise paragraphe, <BR> : Sauter une ligne, <IMG SRC= « » > : marqueur « insérer une image » <A HREF= « » >…</A> : balise « insérer un lien hypertexte » , <H 1> à <H 6> : Titres par importance décroissante, <UL>+<LI> : Liste. . .
Le langage HTML Les balises de formatage du texte <font face = « » color= « » size= >…</font> : police <b>…</b> : gras (b pour « bold » ) <i>…</i> : italique (i pour « italic » ) <u>…</u> : souligner (u pour « underline » ) <center>…</center> : centrer le texte
Le langage HTML La structure de base d’un Fichier HTML <HTML> <HEAD> <TITLE>essai</TITLE> </HEAD> <BODY> 1 er page HTML </BODY> </HTML> à vous de manipuler …
Le langage HTML
Le langage HTML
Dreamweaver MX Dreamweaver ~ Tisseur de rêve Construire un site Internet grâce à une interface plus graphique le bloc note Disposer d’outils pour créer ses applications Web
Création d’un nouveau site
Aperçu de l’interface Cette barre d’outils est propre au document en cours (ici, une page HTML vierge) ; elle permet par exemple de choisir entre le mode visuel ou code informatique Cet espace est dédié aux cinq panneaux rétractables Cette barre d’outils est toujours présente à l’écran ; elle permet d’insérer des objets comme des images ou des tableaux HTML C’est ici que les propriétés relatives à l’objet sélectionné apparaissent
Le but partir de ceci
Pour arriver à cela (par ex)
Construction d’un jeu de cadres • Les cadres permettent d’afficher plusieurs pages HTML dans différentes zones.
Création d’un tableau Utilisons un tableau pour créer le menu du site Cliquons sur le cadre de gauche, qui contiendra le menu (soit le tableau) Cliquons sur l’icône de création de tableau
Création de liens • Clique droit sur le texte qui va servir de lien Préciser le cadre de destination
Insertion d’une image
Insertion d’un lien dans une image Entrer la destination du lien Définir le cadre du lien (ici, cadre principal)
Modification de l’arrière plan
Image « survolée »
Insertion d’un texte flash