Ancho-regla-columna - Trucos CSS

Tabla de contenido:

Anonim

La column-rule-widthpropiedad CSS establece el grosor de la línea que se dibuja entre columnas column-rule-styleen un diseño CSS de varias columnas.

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

Otra forma de hacerlo es utilizar la column-rulepropiedad abreviada, que combina column-rule-width, column-rule-styley column-rule-color.

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

Sintaxis

column-rule-width: thin | medium | thick |
  • Valor inicial: medium
  • Se aplica a: contenedores de varias columnas
  • Heredado: no
  • Valor calculado: longitud absoluta; 0si el column-rule-stylees noneohidden
  • Tipo de animación: por tipo de valor calculado

Valores

column-rule-width toma un solo valor con nombre, longitud o global.

/* 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;

Manifestación

Soporte de navegador

ES DECIR Borde Firefox Cromo Safari Ópera
10+ 12+ 3.5+ 4+ 3.1+ 11,5+
Android Chrome Android Firefox Navegador de Android Safari de iOS mini Opera
85+ 79+ No 3.2+ Todos
Fuente: caniuse

Especificación

Módulo de diseño de varias columnas CSS, nivel 1 (borrador del editor)