HTML




STRUCTURE du TEXTE



LES ENTETES


Les entêtes sont les titres du document. Ils fonctionnent par paire (<balise></balise>), sur 6 niveaux.

BALISE EFFET VISUEL
Titre <H1> niveau H1
Sous-titre <H2> niveau H2
Chapitre <H3> niveau H3
Paragraphe <H2> niveau H4
Sous paragraphe <H5> niveau H5
Sous sous paragraphe <H6> niveau H6





LES ATTRIBUTS des MARQUEURS de STRUCTURE




ATTRIBUT VALEUR EFFET VISUEL
ALIGN <DIV ALIGN=RIGHT>

<DIV ALIGN=LEFT>

DIV ALIGN=CENTER>

<DIV ALIGN=JUSTIFY>

RIGHT

LEFT par defaut

CENTER

JUSTIFY
NOWRAP  
  • Déactive la césure des mots
    Interdit de couper les mots en fin de ligne.
    à l'autre
    • ID  
  • Donne un nom au contenu du marqueur pour faire des liens
    		•
    LANG  
  • Paramètres internationaux
    • CLASS  
  • Définit la classe de l'objet pour les feuilles de style
    		•
    CLEAR  
  • Définit l'espacement entre l'objet inséré et le reste de la page, dans la direction spécifiée.




    • UTILISATION des ATTRIBUTS

    Ils s'utilisent de la manière suivante:



    exemple 1:
    <MARQUEUR ATTRIBUT1=XXXXX ; Texte </MARQUEUR>


    resultat 1: <H2 ALIGN=CENTER> Texte aligné au centre </H2>

    exemple 2:
    <MARQUEUR ATTRIBUT1=XXXXX ATTRIBUT2=XXXX> Texte </MARQUEUR>


    resultat 2: <H2 ALIGN=LEFT COLOR= "yellow"> Texte jaune aligné a gauche </H2>


    LES PARAGRAPHES

    En HTML on code les paragraphes car il les considère comme des blocs de texte. Les navigateurs répartissent au mieux leur contenu dans leur fenêtre.
    C'est la raison pour laquelle un agencement fixe est impossible avec HTML.
    On peut essayer de resoudre cet inconvenient en utilisant les attributs :

    <BR> pour lesretours à la ligne.
    A l'intérieur d'un paragraphe, les espaces, tabulations et retours chariot comptent pour un seul espace .

    <p> et </p> pour réaliser une mise en page par blocs de texte.

    Ces deux balises sont ponctuelles, elles ne nécessitent pas de balise de fermeture.

    exemple

      laissent les pinguoins, bons nageurs des mers, Qui vont, droit devant eux, La banquise etant leur lieu de repos. A l'aube les ours blancs viennent,


    Pour que ce texte s'affiche de facon correcte,on l'écrit en HTML de la façon suivante :
        [...]
        laissent les pinguoins, bons nageurs des mers, <BR>
        Qui vont, droit devant eux,<BR>
        La banquise etant leur lieu de repos. <P>
        A l'aube les ours blancs viennent,
        <BR>
        [...]


    résultat
      laissent les pinguoins, bons nageurs des mers,
      Qui vont, droit devant eux,
      La banquise etant leur lieu de repos.

      A l'aube les ours blancs viennent ,



    NOWRAP pour interdire la césure des mots

    NOBR pour déactiver les sauts de ligne.

    <hr> permet insérer une ligne horizontale.

    BALISE ATTRIBUT EFFET VISUEL
    <p> et </p>  
  • paragraphe
    		•
    <br>  
  • retour à la ligne
    		•
    <hr size=7 width=30% align=right> SIZE
    WIDTH
    ALIGN



    LIGNES HORIZONTALES





    <HR>

    <HR WIDTH="60%">
    <HR WIDTH="40%" ALIGN=right>
    <HR WIDTH="40%" ALIGN=left>
    <HR SIZE=1>
    <HR SIZE=2>
    <HR SIZE=2 NOSHADE>
    <HR SIZE=5>
    <HR SIZE=5 NOSHADE>
    <HR SIZE=9>
    <HR SIZE=9 NOSHADE>



    BLOCS D'ELEMENTS

    Il existe des marqueurs servant à indenter le texte.
    Ce sont des conteneurs. Par exemple:

    CONTENEUR EFFET VISUEL
    <blockquote> et </blockquote>
  • Pour les Citations
    		•
    <address> et </address>
    Pour indiquer une Adresse
    <note> et </note> Pour des Remarques
    <fn> et </fn> Pour une note en fin de page
    <banner> et </banner> Le texte inclus reste statique dans une fenetre et ne participe pas au defilement de la page
    <pre> et </pre> 
  • Utile pour écrire un texte PREFORMATTE
en conservant par exemple     les espaces
    		•




    LES LISTES

    La représentation sous forme de liste dans un texte permet d'appréhender d'un coup d'oeil la structure des informations d'une page. Une liste est un paragraphe structuré contenant une suite d'articles. Il en existe trois types:
      Numérotée ou Ordonnée (Ordered List)
      Les listes à Ordonnéesont délimitées par la balise <OL>. Une autre balise, <LI>, précise l'ensemble des éléments de cette liste.

      Non ordonnée ou liste à puces
      Les listes à puces sont délimitées par la balise <UL>. Une autre balise, <LI>, précise l'ensemble des éléments de cette liste.

      De glossaire
      Les listes à glossaires sont délimitées par la balise <DL>.Ses balises sont <DT> et <DT>
    CONTENEUR TYPE EFFET VISUEL
    <ol>

    <li> article 1 </li>

    <li> article 2 </li>

    </ol>
  • Liste
    Numérotée
    		•
    1. article 1
    2. article 2
    3. article 3
    <ul>

    <li> bleu </li>

    <li> blanc </li>

    <li> rouge </li>

    </ul>
  • Liste
    à puces
    		•
    • bleu
    • blanc
    • rouge
    <dl>

    <dt>Terme</dt>

    <dd>Glossaire</dd>

    </dl>
  • Liste
    de Glossaire
    		•
    article 1
    définition 1
    article 2
    définition 2




    Exemple de Listes imbriquées

    <OL>
    <LI>Chapitre 1
    <UL>
    <LI>Scène 1
    <LI>Scène 2
    <LI>Scène 3 </LI></UL>
    <LI>Chapitre 2</LI></OL>


    résultat
    1. Chapitre 1
      • Scène 1
      • Scène 2
      • Scène 4
    2. Chapitre 2

    ATTRIBUTS SPECIFIQUES AUX LISTES

    ATTRIBUT VALEUR EFFET VISUEL
    SEQNUM  
  • définit le premier numéro
    		•
    START  
  • définit le premier numéro
    		•
    COMPACT  
  • permet de resserrer l'interligne
    		•
    PLAIN  
  • permet de supprimer les puces
    		•
    CONTINUE  
  • La numérotion ne repare pas de 0, mais
    continue après le précédent numero

    • TYPE ( Listes
    ordonnées)    		 1

    A

    a

    i

    I

  • numérotation chiffrée (par défaut)

  • numérotation en capitales

  • numérotation en bas de casse

  • numérotation en chiffres romains en bas de casse

  • numérotation en chiffres romains
    • (I, II, III)
    TYPE (Listes
    à puces)
  • square

    circle

  • disc

    		•
    • puce carrée
    • puce circulaire
    • puce en disque


    Intro Attribut Tableau
    Base formulaire
    Modele Page formulaire2
    Code Couleurs exemple
    Caractere Frames
    Structure Metatags
    Caractères Spéciaux Transfert
    Images Config FTP
    Hyperliens Divers
    Tableaux Adresses Utiles
    Tableaux 3 Autre Couleurs
    Couleurs en Anglais Convertisseur

    cette page date de jours