1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
Dismiss Notice
Welcome to our Education website, plz like our page facebook to support us. Thank You and wish you good navigation

HyperText Markup Language HTML

abdelouafiSep 27, 2016

    1. abdelouafi

      abdelouafi Administrator Staff Member

      Messages:
      287
      Likes Received:
      9
      Trophy Points:
      18
      Joined
      Sep 13, 2016
      Chapitre 1:
      HyperText Markup Language
      HTML


      Présentation:
      HTML: HyperText Markup Language

      Le code HTML est déchiffré par le navigateur du client. Tous les navigateurs existant reconnaissent parfaitement la syntaxe HTML.
      Les pages web faites uniquement avec HTML sont suffixées par l’extension .htm ou encore .html.
      L’édition d’une page web en code HTML est tellement fastidieux. Il existe des logiciels d’édition des pages Web (éditeurs web) qui permettent de générer le code HTML tout en offrant au développeur une interface conviviale en mode création (outils de traitement de texte et de mise en page, outils de dessin…).

      Quelques éditeurs professionnels (dits éditeurs WYSIWYG): DreamWeaver, FrontPage, Golive, WebExpert, Nview…


      Syntaxe HTML I


      Une balise HTML prend la forme suivante:

      Code:
      <balise> objet décrit par la balise </balise>
      Exemple:

      Code:
      <b> ENSA </b> de Marrakech
      Sur le navigateur on peut visualiser: ENSA de Marrakech

      Le texte ENSA est placé entre les balises <b></b> (écriture en gras)

      Syntaxe HTML II
      En générale les balises HTML s’écrivent sous la forme:

      Code:
      <balise  attribut1=‘’valeur1’’  attribut2=‘’valeur2’’  … >
      Objet décrit par la balise

      </balise>


      Exemple:

      Code:
      <font face=‘’verdana’’ color=‘’blue’’ size=‘’3’’>
      
        Bonjour
      
        </font>
      Sur le navigateur on visualise: Bonjour


      Font: balise de mise en forme du texte

      Face: attribut qui signifie police

      Color: attribut qui définit la couleur du texte

      Size: attribut qui définie la taille des caractères


      Il est possible de regrouper plusieurs balises à la fois:

      <balise1> <balise2> <balise3>

      objet décrit par les balises 1, 2 et 3

      </balise3> </balise2> </balise1>


      Règle générale:

      La dernière balise ouverte est la première qui doit être fermée.

      Cette règle n’est pas obligatoire mais vivement recommandée surtout si l’on court après une validation du W3C!


      Exemple:

      Code:
      <font face=‘’verdana’’ color=‘’blue’’ size=‘’3’’> <b> <i> <u>
      
        Bonjour
      
        </u> </i> </b> </font>
      Sur le navigateur on visualise: Bonjour


      <b></b>: gras <i></i>: italique <u></u>: souligné



      Les commentaires:

      En HTML les commentaires sont délimités par <!-- et --> tout ce qui se trouve à l’intérieure des délimiteurs est ignoré par le navigateur.

      Exemple:


      <!-- Les balises <b> et </b> mettent ‘Bonjour’ en gras -->


      Les balises de base:


      <html></html> : début et fin du document HTML

      <head></head>: Entêtes du document

      <body></body>: corps du document (c’est la partie visualisée sur

      le navigateur)


      Ces trois balises sont obligatoires au sein d’un document HTML.


      Exemple de document HTML

      Code:
      <html>  <!-- Début du document nommé test.htm -->
      
      <head>
      
        </title>Ceci est un test</title> <!-- Titre du document -->
      
      </head>
      
      
      <body>  <!-- La partie du document affichée sur le Navigateur -->
      
        <font face=‘’verdana’’ size=‘’2’’ color=‘’#0000FF’’>
      
        <b>Bonjour</b>, c’est juste une page de test!
      
        </font>
      
      </body>
      
      
      </html>
      upload_2016-9-27_11-0-30.png

      Quelques balises:

      <p></p> : nouveau paragraphe

      <br> : saut de ligne (sans </br>)

      <a></a> : lien hypertexte (ou hyperlien)

      <b></b>, <i></i>, <u></u>, <s></s> : gras, italique, souligné, barré

      <font></font>: balise de mise en forme du texte (police, couleur et taille)

      <div></div>: balise de mise en forme (alignement centré, justifié…)

      <img> : insertion d’image (sans </img>)

      <span></span> : décoration du texte (surlignage…)

      <table></table>: définition d’un tableau HTML

      <tr></tr> : définition d’une ligne du tableau

      <td></td> : définition d’une colonne du tableau

      <title></title> : Titre du document (affiché sur la barre de titre de la fenêtre)

      <bgsound> : fond sonore de la page (sans </bgsound>)

      <meta>: balise d’échange d’informations avec le navigateur (sans </meta>)

      <script>: balise d’insertion de script (JavaScript, VbScript…)

      <marquee></marquee>: texte défilant (souvent utilisé sur les pages web)

      <form></form>: création d’un formulaire

      Balise <body> (corps de la page)


      -Bgcolor: Couleur de l’arrière plan de la page
      -Background: Image d’arrière plan de la page
      -Topmargin, Bottommargin, Leftmargin, Rightmargin: Marges de la page respectivement supérieure, inférieure, gauche et droite.
      -Text: Couleur par défaut du texte de la page
      -Link: Couleur par défaut des liens hypertextes sur la page
      -Alink: Couleur par défaut des liens hypertextes actifs (qui ont le focus)
      -Vlink: Couleur par défaut des liens hypertextes visités
      Si la couleur des liens et textes n’est pas définie, ceux-ci prennent les couleurs par défaut déclarées dans la balise body.


      Exemple:

      Code:
      <body topmargin=0 leftmargin=0 bgcolor=‘’#0000ff’’ text=‘’blue’’>
      
      …
      
      </body>
      -
       

      Attached Files:

      Last edited: May 8, 2017
      Loading...

Share This Page

Share