Pour les utilisateurs avancés, voici ci-dessous une liste des attributs vous permettant de modifier l'apparence de bords dans votre blog. Ces bords peuvent se situer dans tout élément visuel de la page : en-tête, blog entier, articles, commentaires, blocs situés sur la navigation, liens de catégories, etc. A vous de laisser jouer votre imagination!

Le type de bordure

Le type de bordure se gère à travers de l'attribut 'border-style'. Bien entendu, il est possible de modifier soit toute la bordure (les quatre côtés) ou chaque bordure (gauche, droite, haut, bas) séparément:

  • border-style:valeur; style de toute la bordure
  • border-left-style:valeur; style de la bordure de gauche
  • border-right-style:valeur; style de la bordure de droite
  • border-top-style:valeur; style de la bordure du haut
  • border-bottom-style:valeur; style de la bordure du bas

Pour la valeur, vous pouvez mettre les valeurs suivantes:

  • border-style:none; pas de bordure du tout
  • border-style:dotted; bordure en pointillés
  • border-style:dashed; bordure en tirets
  • border-style:solid; bordure en ligne pleine
  • border-style:double; à vous de tester...
  • border-style:groove; à vous de tester...
  • border-style:ridge; à vous de tester...
  • border-style:inset; à vous de tester...
  • border-style:outset; à vous de tester...

La couleur de bordure

La couleur de bordure se gère à travers de l'attribut 'border-color'. Bien entendu, il est possible de modifier soit toute la bordure (les quatre côtés) ou chaque bordure (gauche, droite, haut, bas) séparément:

  • border-color:valeur; couleur de toute la bordure
  • border-left-color:valeur; couleur de la bordure de gauche
  • border-right-color:valeur; couleur de la bordure de droite
  • border-top-color:valeur; couleur de la bordure du haut
  • border-bottom-color:valeur; couleur de la bordure du bas

Pour la valeur, vous pouvez mettre les valeurs de couleurs dans les deux formats autorisés:

  • border-color:red; en précisant en toutes lettres le nom de la couleur (en anglais)
  • border-color:#ff4545; en précisant la composante 'rouge-vert-bleu'

L'épaisseur de bordure

L'épaisseur de bordure se gère à travers de l'attribut 'border-width'. Bien entendu, il est possible de modifier soit toute la bordure (les quatre côtés) ou chaque bordure (gauche, droite, haut, bas) séparément:

  • border-width:valeur; largeur de toute la bordure
  • border-left-width:valeur; largeur de la bordure de gauche
  • border-right-width:valeur; largeur de la bordure de droite
  • border-top-width:valeur; largeur de la bordure du haut
  • border-bottom-width:valeur; largeur de la bordure du bas

Pour la valeur, vous pouvez mettre les valeurs de mesure dans tous les formats CSS :

  • border-width: 140px; en précisant le nombre de pixels
  • border-width: 10pt; en précisant le nombre de points
  • border-width: 28mm; en précisant le nombre de millimètres
  • border-width: thin; une bordure fine
  • border-width: medium; une bordure moyenne
  • border-width: thik; une bordure épaisse
L'attribut général de bordure

L'attribut général a pour objectif de réduire la quantité de mots à taper. Il permet de combiner tous les attributs de bordure en un seul.

Pour spécifier un attribut de bordure général, il faudra entrer comme valeurs le style, puis la largeur, puis la couleur. Quelques exemples ci-après:

  • border: solid 3px red; toute la bordure, trait plein, 3 pixels de large, rouge
  • border-left: dotted 2mm black; bordure de gauche, trait pointillé, 2 millimètres de largeur,
  • border-bottom: dashed thick #ff3300; bordure du bas, trait tirets, épaisse, couleur: rouge avec un peu de vert