Bordures

border-style ▾ (style du trait de bordure)

Le menu local border-style détermine l'aspect du trait de bordure :

La valeur "définir image…" permet de spécifier une image de bordure.

Côtés

Cochez les cases correspondant aux côtés où la bordure apparaît.

border-width (épaisseur)

Unité de longueur :

• Valeur par mots-clés : thin | medium | large .
• Longueur ou pourcentage. Si vous entrez un nombre (entier ou avec virgule), l'unité de longueur par défaut est px. Les unités possibles sont : px = nombre de pixels (unité par défaut), % = pourcentage, cm = centimètre, mm = millimètre, pt = point, em = valeur de font-size, ex = valeur de x-height, in = inch, pc = pica.
• Une case vide signifie «pas de valeur».

border-radius (arrondi des angles)

Unité de longueur donnant l'arrondi à réaliser dans chaque coin : px,em, %, etc.

Le bouton « Angles » ouvre un dialogue permettant de spécifier quels angles de la boîte seront arrondis. Cliquer le ou les angles désirés.

border-color

Cliquez le bouton pour accéder aux sélecteur de couleurs ou entrez directement une valeur dans le champs de saisie. Voir saisie des couleurs.

Outline

Outline, contour de boîte

De manière similaire à une bordure, un contour s'applique à une boîte : mais contrairement à la bordure, il se situe à l'extérieur des marges. Pourquoi ne pas avoir revu border, on se le demande, CSS est l'art de réinventer l'eau chaude… Comme c'est soit l'une soit l'autre, une case à cocher génère la nouvelle propriété et ouvre un champs supplémentaire :

Outline-offset

Espace supplémentaire entre l'extérieur de la boîte et le contour.

Tables

border-collapse ▾ (fusion des bordures)

Utile pour les bordures de cellules de TABLE : collapse permet la fusion des bordures de cellules adjacentes, separate crée des bordures distinctes.

border-spacing (espacement entre cellules) :

Analogue à une margin; ne fonctionne qu'avec des bordures de cellules séparées : 1 (ou 2) unité de longueur.

empty-cells ▾ (cellule vides)

Détermine le tracé visible ou non de la bordure des cellules vides.

Caption ▾ (légende de table)

Position de la légende d'une table : haut ou bas.

Bordures de styles multiples

L'outil bordures ne permet pas de créer directement une bordure dans laquelle chaque côté possède un style différent : couleur, style ou épaisseur du trait.

Dans ce cas, créez autant de sélecteurs que nécessaire, et utilisez-les de manière combinée :

Vous pouvez aussi entrer une bordure composite avec l'outil crayon ou combiner avec celui-ci : les styles communs dans l'outil bordures, les particularités dans l'outil crayon.

Effacer

Cliquez le bouton Effacer ❌ pour effacer les réglages présents.