Largeur de règle de colonne - Astuces CSS

Table des matières:

Anonim

La column-rule-widthpropriété CSS définit l'épaisseur de la ligne qui est dessinée entre les colonnes column-rule-styledans une mise en page CSS multi-colonnes.

.columns ( columns: 2 600px; column-rule-style: dotted; column-rule-width: 3px; )

Une autre façon de procéder consiste à utiliser la column-rulepropriété abrégée, qui combine column-rule-width, column-rule-styleet column-rule-color.

.columns ( columns: 2 600px; column-rule: dotted 3px #f8a100; )

Syntaxe

column-rule-width: thin | medium | thick |
  • Valeur initiale: medium
  • S'applique à: conteneurs multi-colonnes
  • Héritée: non
  • Valeur calculée: longueur absolue; 0si le column-rule-styleest noneouhidden
  • Type d'animation: par type de valeur calculée

Valeurs

column-rule-width prend une seule valeur nommée, longueur ou globale.

/* Named values */ column-rule-width: thin; column-rule-width: medium; column-rule-width: thick; /* Length values */ column-rule-width: 15px; column-rule-width: 1.5rem; /* Global values */ column-rule-width: inherit; column-rule-width: initial; column-rule-width: unset;

Démo

Prise en charge du navigateur

C'EST À DIRE Bord Firefox Chrome Safari Opéra
10+ 12+ 3,5+ 4+ 3.1+ 11,5+
Chrome Android Android Firefox Navigateur Android Safari sur iOS Opera Mini
85+ 79+ Non 3.2+ Tout
Source: caniuse

spécification

Module de mise en page multi-colonnes CSS niveau 1 (brouillon de l'éditeur)