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.

Slides:



Advertisements
Présentations similaires
Introduction aux Web Services Partie 1. Technologies XML
Advertisements

Création de site internet
Conception de Site Webs Interactifs Cours 3
Conception de Sites Web dynamiques
Conception de Site Webs Interactifs Cours 4
Algorithmes et structures de données avancées Partie Conception de Sites Web dynamiques Cours 8 Patrick Reuter.
Les balises Du HTML au XML. Le HTML* PREMIER TEMPS La première « révolution » est dans son nom : HYPERTEXT Mais cest le M (MARKUP) qui a un grand avenir…
Utilisation de l’outil Firebug
Cascading style sheets
Introduction aux Web Services Partie 1. Technologies HTML-XML
Nouveau blog. WordPress connexion Nommez votre blog.
HTML.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
Documentation pour webmestre site sud-aerien.org
Les feuilles de style La mise en page
Excel Introduction.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
Bienvenue! Qui suis-je? Webmestre depuis 1994 Café Internet en 1996 Commerce électronique Gestion de contenu web Marketing interactif.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
CSS.
1. 2 PLAN DE LA PRÉSENTATION - SECTION 1 : Code HTML - SECTION 2.1. : CSS (Méthode 1) - SECTION 2.2. : CSS (Méthode 2) - SECTION 3 : JavaScript - SECTION.
HTML-CSS-XHTML.
Qelios – Formation Initiation au langage CSS
31 octobre 2012 Grégory Petit
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.
Le langage du Web CSS et HTML
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
Auteur : Frédéric Thériault 1. Les sélecteurs simples  Tous les éléments HTML du sélecteur sont affectés dans le document. Exemple : h1 { color:purple;
LE CSS ISN Terminale S CSS Types de styles.
2. Premiers pas en CSS… Comprendre le fonctionnement de la syntaxe CSS
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
HTML Cours 2.
Auteur : Frédéric Thériault 1. Les boîtes 2 Les attributs 3 width height margin margin-top margin-right margin-bottom margin-left border-style border-width.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
Auteur : Frédéric Thériault 1. Page à intégrer 2.
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.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
Auteur : Frédéric Thériault 1. Les titres  (de 1 à 6) Titre 1 Titre 2 Titre 3 Titre 4 Titre 5 Titre 6 2.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
HTML Cours 3. Plan du cours Les feuilles de styles CSS Mise en forme du texte et des paragraphes.
T ECHNOLOGIES WEB CHAPITRE II : L E LANGAGE CSS Mme Amani JARRAYA & Mohamed MOHSEN 1.
HTML Cours 3.
eXtensible Markup Language. Généralités sur le XML.
Deug 11 Systèmes d ’Information, cours 3a Michel de Rougemont Université Paris II Edition et Styles.
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.
Cour préparé par Melle Zineb SAALAOUI HTML/CSS.
Cours de HTML suite applications
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.
CSS et DREAMWEAVER.
Html et css.
24 octobre 2012 Grégory Petit
Language html VI- Les CSS. Les CSS CSS: Cascading Style Sheets. Feuilles de Styles en Cascade En typographie, une feuille de style désigne l'ensemble.
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.
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 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.
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.
SI28 – Ecriture interactive et multimédia Sylvain Slaton – Pierre Laporte.
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.
Dreamweaver CS4 séance 1 Ahmed Aryan – Isma Teir.
DREAMWEAVER SÉANCE 2 SI28 Jonathan Barone – Thomas Lulé.
SI28 : D REAMWEAVER 2 Audrey BUISSON – GSU05 Romain LASSALLE – GI05 1 SI28 – Ecriture interactive et multimedia.
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.
INITIATION A LA CREATION D’UNE PAGE WEB C-X. PROSPERINI A : COMMUNICATION ET SYNDICATS Afrique Francophone 20/04/2010.
Révisions pour l’exam L2 Informatique Obligatoire.
Le CSS Principe de séparation du contenu et de la mise en forme
CSS et DREAMWEAVER (Suite et fin)  Les liens
Transcription de la présentation:

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 d’une page Web en fonction du média (imprimante, écran, ordinateur de poche, …) 2

CSS 2 vs CSS 3  CSS 2 Supporté par tous les navigateurs connus  CSS 3 Possède plusieurs additions ○ Bordures arrondis ○ Effets sur le texte ○ … 3

Ajouter un style directement via dans la balise HTML  Ceci est un paragraphe important 4

Ajouter un style via un fichier externe  En ajoutant dans l’entête :  Et en ayant le fichier style.css (sous le répertoire css) qui contient : p { background-color:blue; }  On obtient : 5