Les paragraphes.

Si vous trouvez une article intéressante, vous pouvez participer à sa diffusion en utilisant les boutons de partage situés ci-dessous.

Les paragraphes.

Pour insérer un paragraphe il faut utiliser la balise <p> et elle est de loin celle que vous utiliserez le plus et doit être obligatoirement fermée par </p>. Ce qui sera inséré entre <p> et </p> sera un paragraphe.

Comme nous l'avons vu précédemment, ce sont les paramètres CSS combinés de body et de corps qui déterminent la couleur de la police, sa taille son alignement, etc.

Vous pouvez modifier les paramètres d'un ou de plusieurs paragraphes qui auront dans ce cas, la même classe.

Copier ce qui suit dans le XHTML (ne tenez pas compte des numéros de ligne).

1
2

<p class="important">Ce texte est important et est mis en évidence graçe au CSS. (Ce texte
est juste un exemple).</p>

Tout se joue dans le CSS (ne tenez pas compte des numéros de ligne).

1
2
3
4
5

.important{
color:#f00;
text-align:center;
font-variant:small-caps
}

Chaque fois que vous utiliserez cette classe sur une page, les mêmes paramètres CSS s'y appliqueront.

Utiliser une balise en ligne

Vous pouvez mettre certaine partie du texte en évidence directement sur votre page HTML grâce aux balises de type en ligne (in line ang.) comme <strong>, <b>, <em>. Pour en savoir plus sur les balises de type bloc et en ligne voyez la rubrique « Ce qu'il faut savoir. »

Copier ce qui suit dans le XHTML (ne tenez pas compte des numéros de ligne).

1
2
3
4
5
6
7

<p> Ceci est un mot <strong>important</strong>. </p>

<p> Ceci est un mot en caractère <b>gras</b>. </p>

<p> Ceci est un mot en <em>italique</em>. </p>

<p> Ceux ci sont des mots en <em><b>gras et italique</b></em>. </p>

La balise span.

La balise span (fusion fr.) est utilisée souvent pour souligner l'importance d'un mot ou d'un ensemble de mots. Elle sera accompagnée d'un id (identifient unique) mais le plus souvent par une classe (class). Utilises la balise span plutôt que les balises en lignes que nous avons vu précédemment.

Copier ce qui suit dans le XHTML (ne tenez pas compte des numéros de ligne).

1
2
3
4
5

<p> Ce texte est <span class="surligner">surligner</span>. </p>

<p> Ce texte est <span class="rouge">rouge</span>. </p>

<p> Ce texte est en <span class="capital">capital</span>. </p>

Attention: surligner, rouge et capital sont les noms d'une classe et n'auront aucun effet s'il n'y a pas de paramèttre CSS associé à ces classes.

Tout se joue dans le CSS (ne tenez pas compte des numéros de ligne).

1
2
3
4
5
6
7

.surligne{
background-color:#ef2
}
.rouge{color:#e01
}
.capital{font-variant:small-caps; text-decoration:underline
}

La balise blockquote et <br />.

« Quote » en anglais veut dire « citer ». La balise blockquote doit donc être utilisée pour mettre en relief un « bloc » de citation. Elle ne doit pas être utilisée pour mettre un paragraphe en retrait. La balise br est simplement un saut de ligne.

Copier ce qui suit dans le XHTML (ne tenez pas compte des numéros de ligne).

1
2
3
4
5
6
7
8

<blockquote>
 <p>
  «Le monde ne sera pas détruit par ceux qui font le mal,<br />
  mais par ceux qui les regardent sans rien faire.»<br />
  <br />
  Albert Einstein.
 </p>
</blockquote>

Pour mettre un paragraphe en retrait, utiliser plutôt cette méthode :

Copier ce qui suit dans le XHTML (ne tenez pas compte des numéros de ligne).

1
2
3

<p class="retrait">
Étant donné que nous attribuons une classe à la balise <p>, nous pouvons choisir de mettre en
retrait le nombre de paragraphes que nous voulons sur la même page. (Ceci est juste un exemple de paragraphe). </p>

Tout se joue dans le CSS (ne tenez pas compte des numéros de ligne).

1
2
3

.retrait{
padding:0 5%
}

LE CONCEPTEUR DE SITE WEB.com

Pour un site professionnel

 514 363-4169
 serge@leconcepteur.ca