3. Personnaliser une page web Visualiser les liens entre feuille de style et html grâce à l’inspecteur d’éléments Savoir si les modifications doivent être.

Slides:



Advertisements
Présentations similaires
HTML Abda Anne Plan Présentation Structure Texte Listes Images Liens Tableaux Formulaires.
Advertisements

FORMATION API GEOPORTAIL
Algorithmes et structures de données avancées Partie Conception de Sites Web dynamiques Cours 9 Patrick Reuter.
Conception de Site Webs Interactifs Cours 4
Internet : serveurs Web
UV Libre : Refonte du site web ASI Maxime CHAMBREUIL – ASI 3 – Décembre 2001.
Création de pages Web dynamiques et sympathiques.
Utilisation de l’outil Firebug
V 1.5 Site Web de Formation. Intérêts Cette fonctionnalité de Spiral vous permet de créer et gérer des sites web entièrement personnalisable venant s'appuyer.
Mars 2013 Grégory Petit
Bienvenue! Qui suis-je? Webmestre depuis 1994 Café Internet en 1996 Commerce électronique Gestion de contenu web Marketing interactif.
Découverte de la feuille de style. CSS Cascading Style Sheets Il ne s'agit pas ici de faire un cours de code CSS ! Il faudrait un certain nombre de chapitres.
Un blog (pour web log) est un espace de publication personnel, vous permettant de diffuser du contenu sur un espace qui vous est réservé.
HTML / CSS Gestion des systèmes d’information Classe terminale
PhP-MySQL Pagora 2012/2013 CTD 1 - Presentation de moi ^^
Conjoncture des standards Internet et Web Benoît Girard, conseiller stratégique au réseau des webmestres gouvernementaux Ministère des Services gouvernementaux.
Feuilles de styles CSS Syntaxe d'application d'un style à une balise HTML : Les différents types de style : Pourquoi utiliser un style ? Possibilité étendue.
Hot Potatoes
Les feuilles de style en HTML. CSS CSS: feuilles de style en cascade Permettent d’appliquer une mise en page à l’ensemble d’un site très simplement Permettent.
Passer au CSS et autres... Quelle différence entre ces deux pages ? Si vous regardez uniquement le contenu, aucune. Tout se joue sur la mise en forme.
LE CSS ISN Terminale S CSS Types de styles.
2. Premiers pas en CSS… Comprendre le fonctionnement de la syntaxe CSS
Auteur : Frédéric Thériault 1. À quoi ça sert !?  Cascading Style Sheet  Modifier la page Web en ajoutant des styles aux balises  Modifier l’apparence.
Internet : serveurs Web  Clients et serveurs : le navigateur  Sites Web et urls  Fichier source d’une page  Langage HTML 1.
Les balises HTML et les objets JavaScript correspondants Objet document L'objet document est important dans la mesure ou il contient tous les objets du.
Technologies web et web sémantique TP3 - XML. XML eXtensible Markup Language (langage extensible de balisage) – Caractéristiques: méta-langage = un langage.
Apprendre sans se prendre au sérieux !
SI 28 - Écriture interactive & multimédia Dreamweaver Séance 1 Petit Clara & Palfart Julien Printemps2008 Printemps 2008.
PF Link Shop Etablissez un lien entre votre site et The Catalogue PF CONCEPT.
Séance /10/2005 CSS et Dreamweaver. CSS : principes Cascading Style Sheet = feuille de style en cascade Norme du W3C :
Publication Flash sur Internet et Transfert avec Dreamweaver COM3562 Communication Multimédia MARS 2011.
Part 3 & 4.  Toutes balises ouvertes se ferme ◦ Aucun accents ni espace ◦ Encore moins des majuscules  Il en va de même pour les noms de fichier.
Cascading Style Sheets CSS: Feuilles de Style en Cascade Feuille: Fichier-séparé.css Style: Design de votre Site Cascade: la Page d'accueil et les sous.
Concevoir un site web de A a Z Cours 4. Aujourd’hui Retour sur les feuilles de style L’archivage L’importance de valider vos sites web.
24 octobre 2012 Grégory Petit
Séminaire de rentrée cours de programmation web & Wordpress
HTML Rappels des fondamentaux
Mise en forme avancée et Publication. Le CSS Avertissement : vous ne devez pas maitriser le CSS juste savoir qu’il existe et à quoi il sert ! CSS signifie.
Language html & CSS “Examen”. Un exemple La quelle de ces balises n’est pas une balise obligatoire?
Scénario Les scénarios permettent de modifier la position, taille … des calques au cours du temps. Son fonctionnement est très proche de celui de Macromedia.
Dreamweaver Séance 1.
1 Présentation de DREAMWEAVER (1) Gaël TREMEAU GI05 Printemps 2006.
Dreamweaver MX Jauneau Marie Claude-Antoine Zarate.
Présentation Dreamweaver – Partie 2 Mickaël PIQUE – Automne 2004.
Dreamweaver le retour Avec Les Formulaires Les Calques
Dreamweaver (2) ● les calques (layers) ● les comportements
FORMULAIRES FOMULAIRE Permet à l’utilisateur d’entrer des renseignements le concernant. Utilisation –Inscription sur un site –Mise à jour d’une base.
Dreamweaver 2 Plan 1.Calques 2.CSS 3.Modèles 4.Comportements 5.Formulaires 6.Mise en ligne 1 Timothée Devaux Myriam Roudy Dreamweaver 2 Printemps 2008.
Les formulaires Les calques Les comportements Les scénarios Les modèles Les feuilles de styles (CSS) La mise en ligne Les formulaires permettent à l’utilisateur.
DREAMWEAVER Séance 2 SI28 – P06 Nolwenn PICHAUD.
SI28 - Écriture interactive et multimédia Laurent FETZER GSU04, Lucie SOLA GSU06 P PRESENTATION Dreamweaver 2.
DREAMWEAVER SEANCE 1 Axel JACQUET GM05 – Julien VAN MOORLEGHEM GM05 A2008 Écriture interactive & multimédia Présentation Dreamweaver 8.
Dreamweaver MX Séance 2 Présenté par : Bastien Durizy Cedric Le-Rest Formulaire Comportement Style css Gestion de site Calque Scénario Modèle.
DREAMWEAVER MX2 - Séance 2 Les calques Les comportements Les scénarios Les formulaires Les feuilles de style Les modèles Les cadres Mise en ligne Jérôme.
On va découvrir la magie de ....
Dreamweaver 2éme séance Murat Keles. Présentation I.CSS et Dreamweaver II.Les calques III.Les scénarios IV.Les comportements V.Les cadres VI.Mise en ligne.
Introduction au HTML Qu’est ce que le HTML ?
Dreamweaver CS4 séance 1 Ahmed Aryan – Isma Teir.
Dreamweaver 2 Feuilles de Style CSS Formulaires Calques Comportements
Les calques Les Template (modèles) Les Comportements Les scénarios Les formulaires Les CSS Le serveur Web de l’UTC Présentation.
Séance 2 Marie Lavogez Justine Leleu Dreamweaver MX.
SI28 : Ecriture interactive et multimédia
DREAMWEAVER SÉANCE 2 SI28 Jonathan Barone – Thomas Lulé.
1 Dreamweaver SI28: Ecriture interactive et multimédia Vincent Drapier Nabil El Hefni Automne 2006.
SI28 : Dreamweaver 2 Feuilles de styles Calques Template / Modèle Comportements Scénarios Mise en ligne Clément BLONDEL GSM04 Christelle CHATENET GB04.
SI28 : D REAMWEAVER 2 Audrey BUISSON – GSU05 Romain LASSALLE – GI05 1 SI28 – Ecriture interactive et multimedia.
1 er séance SI28 A2004 YIN Lei Emmanuel Eugene. Plan de l’exposé  Introduction au HTML  Le HTML dans le bloc-notes (notepad)  Présentation de Dreamweaver.
Création d’un site WEB 1 – Un site WEB c’est quoi ? 2 – Questions à se poser avant la construction d’un site WEB 3 – Principes de fonctionnement d’un site.
TP ISN-Terminale S Notion de code HTML. I) Visualisation du code source d’une page web Se mettre sur une page web quelconque : clic droit, Afficher la.
Révisions pour l’exam L2 Informatique Obligatoire.
Transcription de la présentation:

3. Personnaliser une page web Visualiser les liens entre feuille de style et html grâce à l’inspecteur d’éléments Savoir si les modifications doivent être faites au niveau du code html ou des css Approfondir ses connaissances en css

Conseils & consignes Prenez le temps d’analyser la structure html et d’analyser les styles « en cascade » qui s’appliquent à un même élément Apprenez à utiliser le sélecteur d’élément pour faire des modifications « live », dans le navigateur Apprenez à repérer les 3 façons dont on peut appliquer un style css à un élément Notez les balises que vous ne connaissez pas et regardez à quoi elles servent dans le memo

A vous de jouer (1 er exercice) ! Connectez-vous à l’adresse suivante : Dans le dossier « cours3 », Ouvrez le questionnaire 6