(OverBlog) Modifier les liens

Il s'agit de modifier tous les liens du blog. Dans d'autres articles, vous verrez qu'il est possible, ensuite de modifier dans les articles, les pages, les modules ...

Vous devez vous rendre dans votre (ou vos) CSS : Design > Mode CSS

Lorsque la ligne n'existe pas, vous la créez ; lorsqu'elle existe, vous la complétez.

MODIFICATION DES POLICES

Le lien au repos

a  {text-align : center ; color : red ; font-weight : bold ; text-decoration : underline ; font-size : 20px ; font-style : italic ; font-family : Comic Sans MS ;}

Le lien au survol de la souris

a:hover  {text-align : center ; color : red ; font-weight : bold ; text-decoration : underline ; font-size : 20px ; font-style : italic ; font-family : Comic Sans MS ;}

Vous effacez ou modifiez ce dont vous ne voulez pas, sachant que

text-align : center centre le texte
text-align : left positionne le texte à gauche
text-align : right positionne le texte à droite
text-align : justify justifie le texte à droite

color : red modifie la couleur de la police, voir les codes couleurs

font-weight : bold transforme la police en gras
font-weight : normal transforme la police en normal

text-decoration : underline souligne le texte
text-decoration : none enlève le soulignement

font-size : 20px fixe la taille de la police

font-style : italic transforme la police en italique

font-family : Comic Sans MS sélectionne la police

AJOUT D'ENCADREMENTS

Le lien au repos

a {border:solid 1px #D8D7D7}

Le lien au survol de la souris

a:hover {border:solid 1px #D8D7D7}

Pour en savoir plus sur les bordures : créer vos encadrements

QUELQUES EFFETS FANTAISIE

Faire clignoter les liens sous FireFox

a {text-decoration:blink;}

Mettre en capital la première lettre de chaque mot des liens

a {text-transform:capitalize ;}

Mettre en minuscule les mots des liens

a {text-transform:lowercase;}

Mettre en minuscule les mots des liens

a { text-transform:uppercase ;}

Faire scintiller les liens au survol de la souris. Vous avez besoin d'un image qui scintille  à mettre en background

a:hover { background-image:URL(adresse de l'image);}

Barrer les liens visités

a:visited { text-decoration: line-through; }