Import et survol image

Transcription

Import et survol image
Initiation à Dreamweaver 8
Refaire un site que l’on nommera Dream10 (dans le dossier Html 18h00.)
Créer une page index
La page index étant ouverte, créer une feuille de style que l’on enregistrera à la racine de Dream10
et qui sera donc attachée à la page index.
Attribuer une couleur d’arrière plan à l’index.
A partir de la page index créer 3 ou 4 pages par Fichier/Enregistrer-sous, ce qui permet d’embarquer sur
chaque page la feuille de style et l’arrière plan
Sur la page 1, on va créer une liste à puces.
Saisir la liste complète en faisant entrée après chaque nom, on aura donc une suite de paragraphes.
Sélectionner tous ces paragraphes
Clic sur l’outil liste numérotée
Si l’on veut attribuer une couleur à la liste.
ctrl+A)
Si la liste n’est plus sélectionnée, la sélectionner à nouveau par (ctrl+A)
Attribuer le style de police rouge par exemple.
Puis continuer en faisant les sous listes à puce comme d’habitude
Pour mettre un titre au dessus de la liste
Placer le curseur devant le premier titre (L de Les insectes)
Faire entrée
On obtient un chiffre supplémentaire
Cliquer sur le bouton liste numérotée
Le chiffre supplémentaire disparaît
Saisir le titre les animaux et lui attribuer un style choisi dans la feuille de style
Penser à sauvegarder par CTRL+S
Fait par Enryc FONT
Arobase Stesteve
le 9 février 2008
Initiation à Dreamweaver 8
Aller sur Internet et télécharger des images (taille moyenne), d’engrenage, dans un dossier images, qui
sera créé dans le dossier Dream10, au moment même où on les enregistre.
Ouvrir la page 2
Dans le menu commun/bouton image
Pour internet on utilise des Gifs ou JPG mais très légers.
On peut combiner du texte et de l’image.
Vous saisissez : ceci est ma première page WEB
Fait par Enryc FONT
Arobase Stesteve
le 9 février 2008
Initiation à Dreamweaver 8
Pour saisir le texte secondaire, c’est-à-dire ce qui apparaîtra dans l’info-bulle au survol de la souris, aller
dans la zone de saisie Sec. Si on ne veut pas de texte secondaire, choisir <vide> dans le menu déroulant.
Pour visionner la page sur le navigateur faire F12 ou bien cliquer sur le bouton Aperçu.
Ce bouton permet aussi de désigner un autre navigateur par exemple Firefox.
Pour désigner une zone réactive
Sélectionner la photo (image, clic gauche dessus)
Dans la fenêtre Propriétés Trois outils. Les mêmes outils se retrouvent dans Commun / Bouton Images.
On sélectionne l’outil zone sélective ovale. Aller à l’endroit où l’on souhaite
souhaite créer une zone réactive.
Bouton gauche enfoncé on dessine la zone.
zone La placer avec le pavé directionnel.
Saisir le nom en bas à droite dans la fenêtre du texte secondaire Sec.
Fait par Enryc FONT
Arobase Stesteve
le 9 février 2008
Initiation à Dreamweaver 8
Cliquer ailleurs pour valider la saisie.
Si l’on souhaite insérer une image survolée.
Il faut deux images de taille identique.
Aller dans le menu commun/bouton Image/Image survolée
Ouverture de la boite de dialogues :
F12 pour visionner sur le Net après avoir fait CTRL +S
Autoriser l’ouverture de la page sur l’internet (contrôle Active X).
Fait par Enryc FONT
Arobase Stesteve
le 9 février 2008
Initiation à Dreamweaver 8
Voilà c’est fini pour aujourd’hui.
Nous avons importé une image. Elle pourra être survolée dans le navigateur et grâce à la
zone réactive nous pourrons identifier les personnes sur l’image. Tout cela avec
Dreamweaver 8.
Fait par Enryc FONT
Arobase Stesteve
le 9 février 2008