terminal-media.fr
icon icon facebook icon icon icon icon
cross

 
rss
 
SERVICES


Le texte en CSS

Décoration de texte

Cette propriété est une propriété de décoration de texte en css.

text-decoration: underline;
souligne le texte
ou
text-decoration: overline;
surligne le texte
ou
text-decoration: line-throught;
texte barré dans son milieu
ou
text-decoration: none;
aucune décoration de texte

Transformation

Cette propriété permet indépendament de l'écriture dans le code source à une apparence dans le navigateur en majuscule ou minuscule.

text-transform: capitalize;
texte avec la première lettre du mot en majuscule

text-transform: uppercase;
texte tout en majuscule

text-transform: lowercase;
texte tout en minuscule

ou
text-transform: none;
aucune transformation de texte

Indentation

c'est un texte dont la première ligne se trouve en retrait par rapport au reste du texte.

la propriété text-indent sa valeur précise peut être exprimer en pixel , ou en valeur relative en pourcentage.

text-indent: 20px;
ou
text-indent: 2%;

Espaces entre les lettres

letter-spacing: 10px;

Espaces entre les mots

word-spacing: 10px;

Interligne

line-height: 12px;

Espaces vides

Cette propriétée permet de gérer les espaces vides tels qu'ils sont écrit dans le code source. white-space: pre;

Alignement horizontal

text-align: center;
alignement texte centré
text-align: left;
alignement texte à gauche
text-align: right
alignement texte à droite
text-align: justify;
alignement texte justifié; text-align: auto;
alignement texte par défaut

Alignement vertical

vertical-align: baseline;
alignement vertical par défaut
vertical-align: sub;
alignement vertical en dessous
vertical-align: super;
alignement vertical en haut

Longueur et hauteur

Pour définir la taille d'une boite, incluant du texte, il est utile d'en définir la largeur et la hauteur, exprimer en pixel ou en pourcentage.

Par exemple:
width: 320px;
height: 240px;

ou sinon
width: 60%;
height: 26%px;

Marqueurs de liste

Cela permet de définir l'apparence à une liste à puce <ul>différent marqueurs.

list-style-type: disc;
cercle plein
list-style-type: circle;
cercle vide
list-style-type: square;
carré
ou une liste <ol>
list-style-type: decimal;
1,2,3
list-style-type: decimal-leading-zero;
01, 02, 03,
list-style-type: upper-roman;
I, II,III
list-style-type: lower-roman;
i,ii,iii
list-style-type: upper-alpha;
A,B,C
list-style-type: lower-alpha;
a, b, c,

Marqueur graphique

Marqueur avec une image
list-style-image: url ('votre_puce.gif');

Ces images peuvent être au format .gif, .jpeg ou .png



Page précédente Revenir à la rubrique Page suivante