CSS:Le pseudo-élément :first-letter

CSS Le pseudo-élément : prmière lettre

Les propriétés CSS

Le pseudo-élément :first-letter produit un style particulier sur la prmière lettre d'un paragraphe

Le pseudo-élément :first-letter

Le pseudo-élément :first-letter produit un style particulier sur la prmière lettre formatée d'un paragraphe. Par exemple :
P:first-letter { text-transform: uppercase }
La règle précédente signifie "mettre la prmière lettre de chaque paragraphe en majuscule couleur rouge". Cependant, le sélecteur "P:first-letter" ne correspond à aucun élément HTML réel. Celui-ci correspond en fait à un pseudo-élément que l'explorateur va insérer au début de chaque paragraphe.

<P>voici un paragraphe HTML plutôt
long qui va être découpé en plusieurs
lignes. La prmière lettre sera identifiée
à l'aide d'une séquence de balises fictives
et sera mise en majuscule couleur rouge.
Les autres lettres vont rester ordinaires
dans la suite du paragraphe.</P>

Code : Sélectionner le code

	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
	<HTML>
	 <HEAD>
	  <TITLE>Lettrine</TITLE>
	  <STYLE type="text/css">
	   P:first-letter { text-transform: uppercase ; color:#FF0000;}
	  </STYLE>
	 </HEAD>
	 <BODY>
		<P>voici un paragraphe HTML plutôt 
		long qui va être découpé en plusieurs 
		lignes. La prmière lettre sera identifiée
		à l'aide d'une séquence de balises fictives
		et sera mise en majuscule couleur rouge. 
		Les autres lignes vont rester ordinaires 
		dans la suite du paragraphe.</P>
	 </BODY>
	</HTML>

Sommaire

Par carabde 10 mars 2014