SlideShare una empresa de Scribd logo
1 de 32
Formation <HTML>
GROUP FACEBOOK BAC INFO 2014
MUHAMMAD ANAS BEN OTHMAN
// HTML
Introduction à HTML
// 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
// Histoire
 Tim Beners-Lee
 1990
 World Wide Web
Consortium (W3C)
 www.w3.org
// Future
 Pages web
 Application web
 Application mobile
 Android
 iOS
 Windows Phone
// Les logiciels
Aide à gagner le temps
// Les éditeurs HTML
 Blocnote
 Notepad++, Sublime text editor
 Adobe Dreamwaver
 Microsoft
 FrontPage
 Expression Web
 WebMatrix
// Les balises
Et leur attribues
// Structure d’une page HTML
Titre de la page
Contenuedelapage
// Comment en HTML ?
// 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
// 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
// Les balises
<p>…</p>
Balise
d’ouverture
Balise
de fermeture
// Les attribues
<html lang="fr">
attribue valeur
// Les éléments
Qui décrit le contenue de votre votre page
// Titres
 Pour inséré un titre on
utilise la balise <hn>
 On remplace n par le
niveau du titre
 Les niveaux sont 6
// Code
// Les paragraphes
 On utilise la balise <p>
 Le contenue est écrit
entre <p> et </p>
// 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
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
// 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
// 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
// Le reste d’éléments
// To be continued
// HTML 5
Une révolution du web avec CSS 3 et JavaScript
// Site web modern
// Applications mobile
// Développement web
Seulement HTML ne suffit pas de construire un site web
dynamique
// Programmation web
 ASP.NET
 PHP
 Ruby
 Python
 Java
 Et autres …
// Bases de données
 Microsoft SQL Server
 MySQL
 Oracle
 Et autres …
// Web Framework
 jQuery
 NodeJS
 Zend Framework
 .NET Framework
// 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 …
Fin
Insh’allah admis !
Contact 50 946 492 / medanasbo@live.com/ www.mabo.tn

Más contenido relacionado

La actualidad más candente

Les bases de l'HTML / CSS
Les bases de l'HTML / CSSLes bases de l'HTML / CSS
Les bases de l'HTML / CSSSamuel Robert
 
Examen principal - PHP
Examen principal - PHPExamen principal - PHP
Examen principal - PHPInes Ouaz
 
Cours complet Base de donne Bac
Cours complet Base de donne Bac Cours complet Base de donne Bac
Cours complet Base de donne Bac Amri Ossama
 
Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3Abel LIFAEFI MBULA
 
Bac info 2000-2015 (Tunisie)
Bac info 2000-2015 (Tunisie)Bac info 2000-2015 (Tunisie)
Bac info 2000-2015 (Tunisie)salah fenni
 
Corrige exercices pascal_fenni_2018
Corrige exercices pascal_fenni_2018Corrige exercices pascal_fenni_2018
Corrige exercices pascal_fenni_2018salah fenni
 
Cours CSS feuilles de style en cascade- mars 2015
Cours CSS feuilles de style en cascade- mars 2015Cours CSS feuilles de style en cascade- mars 2015
Cours CSS feuilles de style en cascade- mars 2015Abdoulaye Dieng
 
Exercices sur-python-turtle-corrige
Exercices sur-python-turtle-corrigeExercices sur-python-turtle-corrige
Exercices sur-python-turtle-corrigeWajihBaghdadi1
 
Web html table tags
Web html  table tagsWeb html  table tags
Web html table tagsKainat Ilyas
 
Série sous programmes (bac scientifique)
Série sous programmes (bac scientifique)Série sous programmes (bac scientifique)
Série sous programmes (bac scientifique)Hichem Kemali
 

La actualidad más candente (20)

Cours php
Cours phpCours php
Cours php
 
cours Php
cours Phpcours Php
cours Php
 
Chapitre 4 Java script
Chapitre 4 Java scriptChapitre 4 Java script
Chapitre 4 Java script
 
Les bases de l'HTML / CSS
Les bases de l'HTML / CSSLes bases de l'HTML / CSS
Les bases de l'HTML / CSS
 
Examen principal - PHP
Examen principal - PHPExamen principal - PHP
Examen principal - PHP
 
Cours complet Base de donne Bac
Cours complet Base de donne Bac Cours complet Base de donne Bac
Cours complet Base de donne Bac
 
Initiation à Bootstrap
Initiation à BootstrapInitiation à Bootstrap
Initiation à Bootstrap
 
Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3
 
Bac info 2000-2015 (Tunisie)
Bac info 2000-2015 (Tunisie)Bac info 2000-2015 (Tunisie)
Bac info 2000-2015 (Tunisie)
 
Corrige exercices pascal_fenni_2018
Corrige exercices pascal_fenni_2018Corrige exercices pascal_fenni_2018
Corrige exercices pascal_fenni_2018
 
Cours HTML/CSS
Cours HTML/CSSCours HTML/CSS
Cours HTML/CSS
 
Mémento CSS
Mémento CSSMémento CSS
Mémento CSS
 
Html forms
Html formsHtml forms
Html forms
 
Cours CSS feuilles de style en cascade- mars 2015
Cours CSS feuilles de style en cascade- mars 2015Cours CSS feuilles de style en cascade- mars 2015
Cours CSS feuilles de style en cascade- mars 2015
 
Exercices sur-python-turtle-corrige
Exercices sur-python-turtle-corrigeExercices sur-python-turtle-corrige
Exercices sur-python-turtle-corrige
 
HTML
HTMLHTML
HTML
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Html tutorials
Html tutorialsHtml tutorials
Html tutorials
 
Web html table tags
Web html  table tagsWeb html  table tags
Web html table tags
 
Série sous programmes (bac scientifique)
Série sous programmes (bac scientifique)Série sous programmes (bac scientifique)
Série sous programmes (bac scientifique)
 

Destacado

Bac blanc base de données
Bac blanc base de donnéesBac blanc base de données
Bac blanc base de donnéeslycee
 
Base de-donn-es-bac-si-95ae18
Base de-donn-es-bac-si-95ae18Base de-donn-es-bac-si-95ae18
Base de-donn-es-bac-si-95ae18Wael Ismail
 
engagement réciproque
engagement réciproqueengagement réciproque
engagement réciproqueLucille Parry
 
CONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et Exemple
CONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et ExempleCONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et Exemple
CONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et ExempleGlobal Negotiator
 
Séries de-révision-4-eco
Séries de-révision-4-ecoSéries de-révision-4-eco
Séries de-révision-4-ecoLassaad Saidi
 
Exemple contrat de partenariat
Exemple contrat de partenariatExemple contrat de partenariat
Exemple contrat de partenariatJamaity
 
Le marché de la bijouterie en France en 2014
Le marché de la bijouterie en France en 2014Le marché de la bijouterie en France en 2014
Le marché de la bijouterie en France en 2014Digitaluxe
 
MESSIKA : stratégie de distribution (e-shop)
MESSIKA : stratégie de distribution (e-shop)MESSIKA : stratégie de distribution (e-shop)
MESSIKA : stratégie de distribution (e-shop)Blandine Darrieutort
 
Formation C# - Cours 2 - Programmation procédurale
Formation C# - Cours 2 - Programmation procéduraleFormation C# - Cours 2 - Programmation procédurale
Formation C# - Cours 2 - Programmation procéduralekemenaran
 
Le marché des Bijoux fantaisie: focus sur les Charms
Le marché des Bijoux fantaisie: focus sur les Charms Le marché des Bijoux fantaisie: focus sur les Charms
Le marché des Bijoux fantaisie: focus sur les Charms sosoguesh
 
Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...
Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...
Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...ATPENSC-Group
 
Ch5 base de données
Ch5   base de donnéesCh5   base de données
Ch5 base de donnéesWael Ismail
 
Introduction à html
Introduction à htmlIntroduction à html
Introduction à htmltesteur_fou
 

Destacado (16)

HTML
HTMLHTML
HTML
 
Bac blanc base de données
Bac blanc base de donnéesBac blanc base de données
Bac blanc base de données
 
Base de-donn-es-bac-si-95ae18
Base de-donn-es-bac-si-95ae18Base de-donn-es-bac-si-95ae18
Base de-donn-es-bac-si-95ae18
 
bac info : série récursivité
bac info : série récursivitébac info : série récursivité
bac info : série récursivité
 
engagement réciproque
engagement réciproqueengagement réciproque
engagement réciproque
 
CONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et Exemple
CONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et ExempleCONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et Exemple
CONTRAT DE JOINT VENTURE INTERNACIONALE - Modèle de Contrat et Exemple
 
Séries de-révision-4-eco
Séries de-révision-4-ecoSéries de-révision-4-eco
Séries de-révision-4-eco
 
Exemple contrat de partenariat
Exemple contrat de partenariatExemple contrat de partenariat
Exemple contrat de partenariat
 
Le marché de la bijouterie en France en 2014
Le marché de la bijouterie en France en 2014Le marché de la bijouterie en France en 2014
Le marché de la bijouterie en France en 2014
 
MESSIKA : stratégie de distribution (e-shop)
MESSIKA : stratégie de distribution (e-shop)MESSIKA : stratégie de distribution (e-shop)
MESSIKA : stratégie de distribution (e-shop)
 
Formation C# - Cours 2 - Programmation procédurale
Formation C# - Cours 2 - Programmation procéduraleFormation C# - Cours 2 - Programmation procédurale
Formation C# - Cours 2 - Programmation procédurale
 
Le marché des Bijoux fantaisie: focus sur les Charms
Le marché des Bijoux fantaisie: focus sur les Charms Le marché des Bijoux fantaisie: focus sur les Charms
Le marché des Bijoux fantaisie: focus sur les Charms
 
Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...
Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...
Fiche de TP 3 sur les bases de données avec les SGBD(Système de Gestion des B...
 
Mes devoirs 4 si
Mes devoirs 4 siMes devoirs 4 si
Mes devoirs 4 si
 
Ch5 base de données
Ch5   base de donnéesCh5   base de données
Ch5 base de données
 
Introduction à html
Introduction à htmlIntroduction à html
Introduction à html
 

Similar a Formation HTML pour Bac Informatique

Cours de développement web de HTML5 .pptx
Cours de développement web de HTML5 .pptxCours de développement web de HTML5 .pptx
Cours de développement web de HTML5 .pptxMounir Gouiouez
 
Outils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidocOutils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidocpriscilla_mommessin
 
Outils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidocOutils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidoccdi-0450786k
 
Outils de publication pour e-sidoc
Outils de publication pour e-sidocOutils de publication pour e-sidoc
Outils de publication pour e-sidocStéphanie Tricard
 
Le langage HTML
Le langage HTMLLe langage HTML
Le langage HTMLBruno Delb
 
Reseau et multimedia2009
Reseau et multimedia2009Reseau et multimedia2009
Reseau et multimedia2009jihen damerji
 
Chapitre 1_HTML_complet_version1.pdf
Chapitre 1_HTML_complet_version1.pdfChapitre 1_HTML_complet_version1.pdf
Chapitre 1_HTML_complet_version1.pdfYassineZARIOUH
 
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptxFormation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptxtanokouakouludovic
 
presentation de html partie par partie et detaillee.pptx
presentation de html partie par partie et detaillee.pptxpresentation de html partie par partie et detaillee.pptx
presentation de html partie par partie et detaillee.pptxBrahimKarimi
 
Normes de base du Web GTI780 & MTI780 ETS A09
Normes de base du Web  GTI780 & MTI780  ETS   A09Normes de base du Web  GTI780 & MTI780  ETS   A09
Normes de base du Web GTI780 & MTI780 ETS A09Claude Coulombe
 
Html de base
Html de baseHtml de base
Html de basekrymo
 
Netpathie apprendre-le-html-en-15-minutes
Netpathie apprendre-le-html-en-15-minutesNetpathie apprendre-le-html-en-15-minutes
Netpathie apprendre-le-html-en-15-minutesNetpathie
 

Similar a Formation HTML pour Bac Informatique (20)

Cours de développement web de HTML5 .pptx
Cours de développement web de HTML5 .pptxCours de développement web de HTML5 .pptx
Cours de développement web de HTML5 .pptx
 
Langage HTML
Langage HTMLLangage HTML
Langage HTML
 
Outils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidocOutils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidoc
 
Outils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidocOutils de publication pour le CMS d'e-sidoc
Outils de publication pour le CMS d'e-sidoc
 
amphi_html.ppt
amphi_html.pptamphi_html.ppt
amphi_html.ppt
 
hassclic284.ppt
hassclic284.ppthassclic284.ppt
hassclic284.ppt
 
Outils de publication pour e-sidoc
Outils de publication pour e-sidocOutils de publication pour e-sidoc
Outils de publication pour e-sidoc
 
Le langage HTML
Le langage HTMLLe langage HTML
Le langage HTML
 
Reseau et multimedia2009
Reseau et multimedia2009Reseau et multimedia2009
Reseau et multimedia2009
 
Chapitre1
Chapitre1 Chapitre1
Chapitre1
 
Cours html5
Cours html5Cours html5
Cours html5
 
Chapitre 1_HTML_complet_version1.pdf
Chapitre 1_HTML_complet_version1.pdfChapitre 1_HTML_complet_version1.pdf
Chapitre 1_HTML_complet_version1.pdf
 
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptxFormation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
Formation developpement web KADODJOMON EMMANUEL COULIBALY.pptx
 
presentation de html partie par partie et detaillee.pptx
presentation de html partie par partie et detaillee.pptxpresentation de html partie par partie et detaillee.pptx
presentation de html partie par partie et detaillee.pptx
 
Html
HtmlHtml
Html
 
Formation web
Formation webFormation web
Formation web
 
Normes de base du Web GTI780 & MTI780 ETS A09
Normes de base du Web  GTI780 & MTI780  ETS   A09Normes de base du Web  GTI780 & MTI780  ETS   A09
Normes de base du Web GTI780 & MTI780 ETS A09
 
Formulaires
FormulairesFormulaires
Formulaires
 
Html de base
Html de baseHtml de base
Html de base
 
Netpathie apprendre-le-html-en-15-minutes
Netpathie apprendre-le-html-en-15-minutesNetpathie apprendre-le-html-en-15-minutes
Netpathie apprendre-le-html-en-15-minutes
 

Formation HTML pour Bac Informatique

  • 1. Formation <HTML> GROUP FACEBOOK BAC INFO 2014 MUHAMMAD ANAS BEN OTHMAN
  • 3. // 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
  • 4. // Histoire  Tim Beners-Lee  1990  World Wide Web Consortium (W3C)  www.w3.org
  • 5. // Future  Pages web  Application web  Application mobile  Android  iOS  Windows Phone
  • 6. // Les logiciels Aide à gagner le temps
  • 7. // Les éditeurs HTML  Blocnote  Notepad++, Sublime text editor  Adobe Dreamwaver  Microsoft  FrontPage  Expression Web  WebMatrix
  • 8. // Les balises Et leur attribues
  • 9. // Structure d’une page HTML Titre de la page Contenuedelapage
  • 10. // Comment en HTML ?
  • 11. // 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
  • 12. // 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
  • 14. // Les attribues <html lang="fr"> attribue valeur
  • 15. // Les éléments Qui décrit le contenue de votre votre page
  • 16. // Titres  Pour inséré un titre on utilise la balise <hn>  On remplace n par le niveau du titre  Les niveaux sont 6
  • 18. // Les paragraphes  On utilise la balise <p>  Le contenue est écrit entre <p> et </p>
  • 19. // 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
  • 20. 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
  • 21. // 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
  • 22. // 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
  • 23. // Le reste d’éléments // To be continued
  • 24. // HTML 5 Une révolution du web avec CSS 3 et JavaScript
  • 25. // Site web modern
  • 27. // Développement web Seulement HTML ne suffit pas de construire un site web dynamique
  • 28. // Programmation web  ASP.NET  PHP  Ruby  Python  Java  Et autres …
  • 29. // Bases de données  Microsoft SQL Server  MySQL  Oracle  Et autres …
  • 30. // Web Framework  jQuery  NodeJS  Zend Framework  .NET Framework
  • 31. // 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 …
  • 32. Fin Insh’allah admis ! Contact 50 946 492 / medanasbo@live.com/ www.mabo.tn