formation html pour bac informatique
TRANSCRIPT
![Page 1: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/1.jpg)
Formation <HTML>GROUP FACEBOOK BAC INFO 2014MUHAMMAD ANAS BEN OTHMAN
![Page 2: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/2.jpg)
// HTMLIntroduction à HTML
![Page 3: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/3.jpg)
// Définition
HTML = Hypertext Markup Language À pour extension .html et .htm C’est une langage du programmation C’est une langage de description Composé d‘un ensemble des attribues Permet de créer des pages web
![Page 4: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/4.jpg)
// Histoire
Tim Beners-Lee 1990 World Wide Web
Consortium (W3C) www.w3.org
![Page 5: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/5.jpg)
// Future
Pages web Application web Application mobile
Android iOS Windows Phone
![Page 6: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/6.jpg)
// Les logicielsAide à gagner le temps
![Page 7: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/7.jpg)
// Les éditeurs HTML
Blocnote Notepad++, Sublime text editor Adobe Dreamwaver Microsoft
FrontPage Expression Web WebMatrix
![Page 8: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/8.jpg)
// Les balisesEt leur attribues
![Page 9: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/9.jpg)
// Structure d’une page HTML
Titre de la page
Conte
nue d
e la
page
![Page 10: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/10.jpg)
// Comment en HTML ?
![Page 11: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/11.jpg)
// Le source code de la page<html>
<head>
<title>Titre de la page</title>
<head>
<body>
<h1>Mon premier page HTML</h1>
</body>
</html>
<mot> est une balise </mot> en ajoute un
slash pour définir la fin du balise <mot>
<body> c’est la balise qui contient le contenue de la page
<title> c’est la balise qui contient le titre de la page
![Page 12: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/12.jpg)
// html, head et body
<html> définir le type de document qui est « Page web »
<head> contient le titre de la page <body> contient les balises qui décrit de
la page
![Page 13: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/13.jpg)
// Les balises
<p>…</p>Balise
d’ouvertureBalise
de fermeture
![Page 14: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/14.jpg)
// Les attribues
<html lang="fr">attribuevaleur
![Page 15: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/15.jpg)
// Les élémentsQui décrit le contenue de votre votre page
![Page 16: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/16.jpg)
// Titres
Pour inséré un titre on utilise la balise <hn>
On remplace n par le niveau du titre
Les niveaux sont 6
![Page 17: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/17.jpg)
// Code
![Page 18: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/18.jpg)
// Les paragraphes
On utilise la balise <p>
Le contenue est écrit entre <p> et </p>
![Page 19: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/19.jpg)
// Mise en forme
On utilise <b> pour inséré un texte en gras
<u> pour un texte souligné
<i> pour un texte italique
<br> pour retourner à la ligne
![Page 20: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/20.jpg)
Mise en forme 2
L’attriue « color » décrit le couleur du texte
L’attribue « size » décrit la taille du texte
Il y a 7 tailles entre 1 et 7
![Page 21: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/21.jpg)
// Liste ordonnée
<ol> signifie que la liste à insérer doit être ordonnée
<li> est un élément de la liste
Utilisant l’attribue « type » on peut changer l’ordre par alphabet, numérique ou nombres Romans
![Page 22: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/22.jpg)
// Liste non ordonnée
<ul> est la liste non oronnée
<li> est un élément de la liste
Utilisant l’attribue « type » on peut changer le cercle par carreau ou cercle vide
![Page 23: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/23.jpg)
// Le reste d’éléments// To be continued
![Page 24: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/24.jpg)
// HTML 5Une révolution du web avec CSS 3 et JavaScript
![Page 25: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/25.jpg)
// Site web modern
![Page 26: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/26.jpg)
// Applications mobile
![Page 27: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/27.jpg)
// Développement webSeulement HTML ne suffit pas de construire un site web dynamique
![Page 28: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/28.jpg)
// Programmation web
ASP.NET PHP Ruby Python Java Et autres …
![Page 29: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/29.jpg)
// Bases de données
Microsoft SQL Server MySQL Oracle Et autres …
![Page 30: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/30.jpg)
// Web Framework
jQuery NodeJS Zend Framework .NET Framework
![Page 31: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/31.jpg)
// Résumé
Introduction HTML, définition, histoire et future Les logiciels Les balises, les attribues Les éléments
Texte Listes Image Tableau Liens hypertexte Formulaires
HTML 5, CSS 3 et JavaScript ASP.NET, PHP, Ruby, Java …
![Page 32: Formation HTML pour Bac Informatique](https://reader036.vdocuments.net/reader036/viewer/2022062420/55ca3d74bb61eb10418b45ea/html5/thumbnails/32.jpg)
FinInsh’allah admis !Contact 50 946 492 / [email protected]/ www.mabo.tn