Column-rule-color - Propriété CSS
Résumé des caractéristiques de la propriété column-rule-color
currentcolor | transparentcurrentcolorcolumn-rule-color passe progressivement d'une valeur à une autre.Schéma syntaxique de column-rule-color.
column-rule-colorLes liens du schéma donnent accès à plus de détails
Télécharger le schéma en SVG
Sur le schéma, les termes en gras sont les mots prédéfinis de CSS, les autres termes sont décrits ci-dessous :
Description de la propriété column-rule-color.
column-rule-color définit la couleur des lignes de séparation entre les colonnes (rule) dans le cas d'une mise en page sur plusieurs colonnes.
Remarque : les colonnes des tableaux ou des grilles ne sont pas concernées par cette propriété.
Pour une description plus générale des paramètres de la ligne de séparation entre les colonnes, reportez-vous à la propriété résumée column-rule.
Et pour une présentation générale des possibilités de mise en colonnes, voyez la page columns.
Syntaxes pour column-rule-color.
- column-rule-color: currentcolor;
La couleur du trait de séparation des colonnes sera la même que celle du texte, pour l'élément concerné.
- column-rule-color: transparent;
Le trait de séparation des colonnes sera transparent, c'est à dire invisible.
- column-rule-color: #448018;
Le caractère dièse (
#) introduit un code hexadécimal sur 3, 6 ou 8 digits. Ce code désigne l'une des couleurs parmi les 65 millions disponibles.
Pour davantage de précisions sur l'écriture du code hexadécimal, reportez-vous à la page sur les couleurs CSS. - column-rule-color: blue;
Plus d'une centaine de couleurs ont reçu un nom standardisé, bien reconnu par tous les navigateurs. Ce nom doit être inscrit sans apostrophes ni guillemets.
- column-rule-color: hsl(...);
De très nombreuses fonctions permettent également de désigner une couleur. Reportez- vous à leur page respective pour connaître leur syntaxe exacte ou à la page les couleurs CSS pour une liste complète de ces fonctions.
Valeurs globales
(communes à toutes les propriétés)
column-rule-color: initial (currentcolor)
column-rule-color: inherit
column-rule-color: revert
column-rule-color: revertLayer
column-rule-color: unset
Consultez les pages suivantes pour plus de détails : initial, inherit, revert, revert-layer, unset.
Animation de column-rule-color.
Comme toutes les propriétés qui prennent une couleur en paramètre, column-rule-color peut être animée de façon très fluide.
Dans cet exemple, la couleur du trait de séparation évolue du noir vers le blanc, en passant par le bleu.
L'animation de la couleur peut se faire également via les fonctions rgb(), hsl(), etc.
Voyez la page de la propriété color pour d'autres exemples d'animation avec les couleurs.
Simulateur.
(1) Texte en provenance de Wikipedia
Prise en charge par les navigateurs (compatibilité).
Les mises en page sur plusieurs colonnes sont à peu près bien prises en charge par les navigateurs actuels. On voit cependant sur le
tableau ci-dessous qu'il reste des incompatibilités.
Cependant la propriété column-rule-color est bien reconnue.
column-rule-color.
multi colonnes
column-rule-colorNavigateurs sur ordinateurs :
Navigateurs sur mobiles :
Navigateurs obsolètes ou marginaux :
Androïd Brower
Baidu Browser
Chrome
Chrome pour Androïd
Edge
Firefox
Firefox pour Androïd
Internet Explorer
KaiOS Browser
Opéra
Opéra Mobile
QQ Browser
Safari
Safari sur IOS
Samsung Internet
UC Browser pour Androïd
Opéra mini
Voir aussi, à propos des mises en page en colonnes.
Les mises en page multi-colonnes sont décrites dans la spécification CSS Multi-column Layout Module (Module CSS - Mise en page multi-colonnes).
La propriété column-rule-color est référencée dans ce module, ainsi que les termes ci-dessous :