World's Strongest Nation
par ici, par ici!!!


AccueilS'enregistrerConnexion

Partagez | 
 

 Tutoriel HTML-partie 6

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Sh@d
Administrateur


Masculin
Nombre de messages : 2066
Age : 30
Humeur Du WSiste :
100 / 100100 / 100

Date d'inscription : 08/01/2006

information WS
niveau: Mangaka & Gamer
Comportement Du WSiste.:
200/200  (200/200)
clan: Kaguya

MessageSujet: Tutoriel HTML-partie 6   Dim 18 Nov 2007, 4:49 pm

Leçon 6 : Quelques éléments de plus


Avez-vous pu créer quelques pages par vous-même ? Sinon voici un exemple :
<html>

<head>
<title>Mon site Web</title>
</head>

<body>
<h1>Un titre</h1>
<p>du texte, du texte du texte, du texte</p>
<h2>Sous-titre</h2>
<p>du texte, du texte du texte, du texte</p>
</body>

</html>



Et maintenant quoi ?


Il est temps d'apprendre sept éléments nouveaux.
De la même façon qu'on met du texte en caractères gras en le plaçant entre une balise ouvrante et une balise fermante , on peut afficher le texte en italique avec la balise ouvrante et la balise fermante . Bien sûr, le « i » est l'abréviation de « italique ».
Exemple 1 :
Voici un texte en italique.



Ce qui donne dans le navigateur :Voici un texte en italique.

De même, on peut diminuer le texte avec la balise small :
Exemple 2 :
<small>Voici un text diminué.</small>



Ce qui donne dans le navigateur :Voici un texte diminué.

Puis-je utiliser plusieurs éléments en même temps ?


Vous pouvez aisément utiliser plusieurs éléments en même temps tant que vous évitez le chevauchement des éléments. Cet exemple le montre mieux :
Exemple 3 :
Si vous voulez écrire un texte en caractères gras et en italique, il faut le faire comme ceci :
Un texte en caractères gras et en italique



Et NON comme cela :
Un texte en caractères gras et en italique



La différence tient au fait que, dans le premier exemple, nous avons clos la balise ouverte la première en dernier. Nous évitons ainsi de nous tromper ainsi que le navigateur.
Plus d'éléments !


Comme indiqué dans la leçon 4, il existe des éléments à la fois ouverts et fermés dans la même balise. Ces éléments dits vides ne sont pas associés à un passage particulier dans le texte mais sont des étiquettes isolées. Un exemple d'un tel élément est celui de
, qui force un saut de ligne :
Exemple 4 :
Du texte
et encore dans une nouvelle ligne



Dans le navigateur, cela donne :Du texte
et encore dans une nouvelle ligne

Remarquez que la balise s'écrit comme la contraction d'une balise ouvrante et d'une balise fermante, avec un espace et une barre oblique à la fin :
. En principe, on pourrait aussi l'écrire

, mais pourquoi rendre les choses plus compliquées que nécessaires ?
Un autre élément ouvert et fermé dans la même balise est
, lequel sert à tracer une ligne horizontale ; « hr » tient pour « horizontal rule » (N.d.T. ligne horizontale) :
Exemple 5 :





Dans le navigateur :



Comme exemples d'éléments nécessitant une balise ouvrante et une balise fermante, comme c'est le cas pour la plupart, les éléments ul, ol et li. Ces éléments servent à fabriquer des listes.
« ul » est l'abréviation de « unordered list » (N.d.T. liste non ordonnée), et insère des puces pour chaque élément de liste. « ol » est l'abréviation de « ordered list » (N.d.T. liste ordonnée), et numérote chaque élément de liste. Pour créer les éléments de la liste, on utilise la balise li, abréviation de « list item » (N.d.T. élément de liste). Confus ? Voyez les exemples :
Exemple 7 :

  • Un élément de liste

  • Un autre élément de liste





Ça donnera dans le navigateur :

  • Un élément de liste
  • Un autre élément de liste


Exemple 8 :

  1. Premier élément de liste

  2. Second élément de liste





Et dans le navigateur :

  1. Premier élément de liste
  2. Second élément de liste


Ouf ! C'est tout ?


C'est tout pour l'instant. Encore une fois, expérimentez et fabriquez vos propres pages avec les sept éléments appris dans cette leçon :
Italique
<small>Texte diminué</small>

Saut de ligne

Ligne horizontale
    Liste

        Liste ordonnée

        1. Élément de liste

Revenir en haut Aller en bas
http://ws-nation.jeun.fr
 
Tutoriel HTML-partie 6
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Les volcans d'Indonésie (une petite partie)
» Il faut que la Bible fasse partie de la vie des fidèles.... a affirmé Benoît XVI
» 1er partie Baudrier porte briquet.
» L’Egypte ou le Mystère d’Horus - 1ere Partie - L'école des mysteres
» Html pour les nuls

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
World's Strongest Nation :: .·¯(_.·¯(_.·¯(_ WS- Sciences et Technologies _)¯`·._)¯`·._)¯`·. :: WS-Tutoriaux-
Sauter vers:  
Créer un forum | © phpBB | Forum gratuit d'entraide | Signaler un abus | Forum gratuit | Sciences et Savoirs | Divers...