|
Connexion ratee
|
 |
Le but de cette feuille de style est de formater automatiquement la première ligne
d'un paragraphe, sans que l'on soit obligé d'y apposer un style 'localement'. D'autant plus pratique que suivant
la largeur d'écran de votre visiteur, la ligne n'aura pas forcément toujours la même largeur. |
 |
 |
 |
|
 |
Les feuilles de style peuvent s'appliquer sur des classes d'objets, par exemple
<P>, <H2>, <TD>... mais pas à un élément comme la première
ligne d'un paragraphe ou d'un tableau.
Pour cela, on a recours à une 'pseudo-classe'. Dans notre cas, on utilise la pseudo-classe
':first-line'.
Cette classe est reconnu dans plusieurs cas, si elle n'est pas appliquée à une classe particulière
(<P> par exemple) :
- Premier texte de la page,
- tout <P>,
- tout texte précédé d'un alignement (<center> par exemple).
- En fait, tout ce qui génère un nouveau paragraphe (donc pas la balise
<br>).
Elle s'applique également à une autre classe selon l'écriture suivante :
.nom_de_la_classe:first-line { ... }. |
 |
 |
 |
|
 |
dans la partie <head>
 |
 |
 |
 |
<style>
:first-line { font-size: 150% ; font-weight: bold; }
.special:first-line { font-size: 200% ; color: red; }
</style>
|
|
 |
 |
 |
 |
dans la partie <body>
 |
 |
 |
 |
Ceci est le premier texte de la page, il applique donc la feuille de style de base.
Cette ligne a été générée par un <br> à la fin de la ligne précédente, elle n'applique donc pas la feuille de style.
<p>Ceci est un texte encadré par une balise <p> et </p>, il applique donc la feuille de style de base.
<center>Ceci est un texte encadré par une balise <center> et </center>, il applique donc la feuille de style de base.<br></center>
Cette ligne a été générée par un <br> à la fin de la ligne précédente, elle n'applique donc pas la feuille de style.
<table border="1">
<tr>
<td>Ceci est un texte dans un tableau, il applique la feuille de style</td>
<td valign="bottom"> et sur toutes les cellules !!</td>
</tr>
<tr>
<td colspan="2">Sauf sur...<br>Macintosh :-(</td>
</tr>
</table>
<p class="inconnue">Ceci est un texte encadré par une balise <p> et </p>, avec un appel de style 'inconnu', il applique donc la feuille de style par défaut.</p>
<p class="special">Ceci est un texte encadré par une balise <p> et </p>, avec un appel de style 'connu', il applique donc la feuille de style appelée.</p>
|
|
 |
 |
 |
 |
|
 |
 |
 |
|
 |
|