Definición de .column-rule-style utilizado en CSS
La propiedad CSS .column-rule-style especifica el tipo de línea que se dibuja entre columnas en un diseño de columna CSS.
Caso de uso : propiedad CSS column-rule-style
Si quieres utilizar esta propiedad de CSS en tu hoja de estilos, hazlo de la siguiente manera:
.columns {
columns: 2 600px;
column-rule-style: solid;
}
Otro ejemplo más avanzado de .column-rule-style es el siguiente de CODEPEN:
Sintaxis de .column-rule-style en CSS
column-rule-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;
Valores
| Valor | Descripción | Manifestación |
|---|---|---|
| ninguna | Valor por defecto. No define ninguna regla | |
| oculto | Define una regla oculta | |
| punteado | Define una regla punteada | |
| punteado | Define una regla discontinua | |
| sólido | Define una regla sólida | |
| doble | Define una regla doble | |
| ranura | Especifica una regla ranurada 3D. El efecto depende de los valores de ancho y color. | |
| cresta | Especifica una regla estriada 3D. El efecto depende de los valores de ancho y color. | |
| recuadro | Especifica una regla de inserción 3D. El efecto depende de los valores de ancho y color. | |
| comienzo | Especifica una regla de salida 3D. El efecto depende de los valores de ancho y color. | |
| inicial | Establece esta propiedad en su valor predeterminado. | |
| heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .column-rule-style
Los números de la tabla especifican la primera versión del navegador que es plenamente compatible con la propiedad.
Los números seguidos de -webkit- especifican la primera versión que funcionó con un prefijo.
| Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| column-rule-width | 50.0 4.0 -webkit- | 10.0 | 52.0 2.0 -moz- | 9.0 3.1 -webkit- | 37.0 15.0 -webkit 11.1 |