Protocole HTTP / Architecture REST HTTP : HyperText Transfer
Protocol Mthodes principales Get Post Put Delete Codes de statut
200 (2xx : Succs) 404 (4xx : Erreur du client) 500 (5xx : Erreur du
serveur) 301 (3xx : Redirection) Ressource Post Get Put Delete
Traitement Etat 7
Page 8
XHTML ? CSS ? XHTML : eXtensible HyperText Markup Language
Contenu, Informations logiques Exemple : Le titre de ma page est
Page daccueil CSS : Cascading Style Sheets Prsentation du contenu
Exemple : Le texte de ma page est rouge 8
Page 9
Navigateurs Internet Explorer Firefox Chrome Safari 9
Page 10
Editeurs Le plus simple : Bloc notes ! Pour dbuter : Sous
Windows : Notepad++ Sous Mac OS : TextMate EDI : Eclipse PDT,
Aptana Netbeans PHP Storm 10
Page 11
XHTML / CSS : LES BASES 11
Page 12
XHTML Ce nest pas un langage de programmation : cest un langage
de prsentation Langage proche de XML Structure smantique de
linformation, du contenu HTML 4 ? XHTML 1,1? HTML 5 ? 12
Page 13
XHTML : Balises Paire de balise Balise ouvrante + Balise
fermante Exemple : Titre de ma page Balise unique Exemple : 13
Page 14
XHTML : Balises Imbrication des balises 14
Page 15
XHTML : Attributs (1/2) Exemples : C'est un petit pas pour
lhomme` un bond de gant pour lhumanit. 15
Page 16
XHTML : Attributs (2/2) Attributs universels Title Bulle daide
Id Identifiant unique de llment Class Classe de llment 16
Page 17
XHTML : Exercice Modliser une voiture Parties de la voiture
Siges Volant Roues Utiliser les balises avec des identifiants et
des classes 17
Page 18
XHTML : Commentaires 18
Page 19
XHTML : Structure dune page 19
Page 20
XHTML : Titres 6 niveaux Titre de la page 20
Page 21
XHTML : Paragraphes / Sauts de ligne Un saut de ligne dans
lditeur nest pas un saut de ligne visible Balise pour sauter une
ligne : Paragraphes : Texte Ligne 1 Ligne 2 21
Page 22
XHTML : Espacer le texte Texte avec espaces Affichera : Texte
avec espaces Solutions Entit HTML : CSS 22
Page 23
XHTML : Mise en valeur de texte Important Rendu par dfaut en
gras Peu important Rendu par dfaut en italique PS : Ne plus
utiliser les balises et 23
Page 24
XHTML : Autres balises Exposant Indice Citation courte Citation
longue LAN Accronyme 24
Page 25
XHTML : Liens (1/3) Relatif ou absolu ? Image.jpg relatif
dossier/icone.ico relatif ../../footer.html relatif
C:\Site\index.html absolu /var/www/site/index.html absolu / ???
Relatif : dpend du contexte Absolu : prcise le chemin complet
25
Page 26
XHTML : Liens (2/3) Lien vers une autre page du mme site Un
lien Lien vers une page dun autre site Google Ouvrir dans une
nouvelle fentre ? non ! Lancer un client mail ? Ecrivez moi !
26
Page 27
XHTML : Liens (3/3) Ancres Lien vers un endroit prcis dans une
page : Lien vers titre 1 Lien vers titre 2 Titre 1 bla bla bla Lien
vers un endroit prcis dans une autre page Lien vers titre 1 Lien
vers titre 2 27
Page 28
XHTML : Images Formats : JPEG, PNG, GIF, BMP Attention : Aux
chemins daccs Aux accents Aux espaces Image cliquable 28
Page 29
XHTML : Balises gnriques inline block Utiliser les attributs id
et class 29
Page 30
Plan du cours Introduction XHTML / CSS : Les bases XHTML CSS
Utilisation avance 30
Page 31
CSS : Introduction Cascading Style Sheets Feuilles de style
Langage de mise en forme de lHTML 31
Page 32
CSS : Placement 3 mthodes de placement Fichier CSS externe
(head) Balise de style (head) Attribut de style JavaScript :
mthodes identiques de placement 32
Page 33
CSS : Syntaxe (1/2) balise { proprit: valeur; } Exemple : body
{ color: #ff0000; background-color: yellow; font-size: 12px; } La
partie prcdent laccolade sappelle le slecteur 33
Page 34
CSS : Syntaxe (2/2) Cibler plusieurs lments : em, strong {
text-decoration: underline; } Souligne tous les mots importants
Cibler des lments par imbrication p a{ color: green; } Colore en
vert uniquement les liens contenus dans les paragraphes 34
Page 35
CSS : IDs et Classes Cibler un lment en particulier #navigation
{ color: blue; } Cibler des lments par classe .alert { color: red;
}.warning { color: orange; }.huge{ font-size: 2em; } Attention
Texte 35
Les listes Listes non ordonnes Listes ordonnes Listes de
dfinitions 44
Page 45
Listes non ordonnes (1/2) Listes non ordonnes Pierre Feuille
Ciseaux Affiche : Pierre Feuille Ciseaux 45
Page 46
Listes non ordonnes (2/2) Listes non ordonnes imbriques Menu 1
Sous menu 1.1 Sous menu 1.2 Menu 2 Sous menu 2.1 Sous menu 2.2
Affiche Menu 1 Sous menu 1.1 Sous menu 1.2 Menu 2 Sous menu 2.1
Sous menu 2.2 46
Page 47
Listes ordonnes Conception Dveloppement Test Affiche:
1.Conception 2.Dveloppement 3.Test 47
Page 48
Listes de dfinitions LAN Local Area Network WAN Wireless Area
Network 48
Page 49
Listes et CSS List-style-position outside inside
List-style-type Listes non ordonnes disc (dfaut) circle square none
Liste ordonnes decimal (dfaut) decimal-leading-zero upper-roman
lower-roman upper-alpha lower-alpha lower-greek List-style-image
url("/images/folder.png"); 49
Page 50
Menu de navigation et listes Accueil Artistes Vidos 50
Page 51
Block / Inline Block : h1, p, ul, div Inline : strong, a, img,
span Une balise block ne peux tre contenu dans une balise inline
display: block / display: inline 51
Formulaires (1/6) Les formulaires constituent le premier pas
vers les sites dynamiques (Client / Serveur) Les donnes dun
formulaire sont envoyes pour tre traites cot serveur 62
Page 63
Formulaires (2/6) Votre pseudo : Votre mot de passe : 63
Page 64
Formulaires (3/6) Pseudo : Mot de passe : Un champ vide est
quand mme transmis pseudo Rudy motdepasse 123456 64 Rudy Pseudo :
Mot de passe :
Page 65
Formulaires (4/6) Rouge Vert La valeur slectionn est transmise
: couleur green 65 Rouge Vert
TP : Chat / Twitter Raliser linterface graphique Utiliser les
diffrentes balises Tableaux Listes Formulaires Fonctionnalits Page
daccueil Lister les messages existants Ajouter un nouveau message
Page didentification Page membre 69
Page 70
70
Page 71
Introduction (2h) Evaluation Navigateurs Protocole HTTP
Editeurs Bases XHTML (2h) Introduction Partie 1 Balises Attributs
Structure dune page Commentaires Partie 2 Paragraphes Sauts de
ligne Titres Mise en valeur de texte Autres balises Partie 3 :
Liens Relatif et absolu Liens vers une autre page Ancres Mails
Partie 4 : images Formats Balise Partie 5 : Balises gnriques CSS
(2h) Introduction Partie 1 : Premiers pas Mthodes de placement
Appliquer du style aux balises IDs et Classes Texte Tailles Polices
Alignement Effets Couleurs Fond Pseudo Formats Liens Premire lettre
et premire ligne Avant / Aprs Avanc 6h Listes Block / Inline
Tailles Bordures Marges Flottants Positionnement Structure dune
page Tableaux Formulaires JavaScript PHP 71
![Cours Mysql[1]](https://img.pdfslide.fr/doc/110x75/577d36901a28ab3a6b937367/cours-mysql1.jpg)
