CSS sarake sääntö tyyli ominaisuus

Määrittely ja käyttö

columnRuleStyle-ominaisuus määrittelee sarakkeiden välistyksen tyylin.

Katso myös:

CSS3-opas:CSS3 monikolonnaisuus

HTML DOM -oppaasti:columnRuleStyle-ominaisuus

Esimerkki

Aseta välistys sarakkeiden välillä:

div {
  column-rule-style: dotted;
}

Kokeile itse

Lisää esimerkkejä sivun alaosassa.

CSS-syntax

column-rule-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset;

Ominaisuuden arvo

Arvo Kuvaus Testi
ei Määrittelee säännön, jossa ei ole reunaa. Testi
hidden Määrittelee piilotetun säännön. Testi
dotted Määrittelee piste-säännön. Testi
dashed Määrittelee viivamerkki-säännön. Testi
solid Määrittelee täysin reuna-säännön. Testi
double Määrittelee kaksoisreuna-säännön. Testi
groove Määrittelee 3D-groove-säännön. Tämä vaikutus riippuu leveyden ja värin arvoista. Testi
ridge Määrittelee 3D-ridge-säännön. Tämä vaikutus riippuu leveyden ja värin arvoista. Testi
inset Määrittelee 3D-inset-säännön. Tämä vaikutus riippuu leveyden ja värin arvoista. Testi
outset Määrittelee 3D-outset-säännön. Tämä vaikutus riippuu leveyden ja värin arvoista. Testi

Tekninen yksityiskohta

Oletusarvo: ei
Perinnäisyys: ei
Versio: CSS3
JavaScript-syntax: object.style.columnRuleStyle="dotted"

Lisää esimerkkejä

Column-count
Jaa div-elementin teksti kolmeen osaan.
Column-gap
Jaa div-elementin teksti kolmeen osaan ja aseta välistys 30 kuvapistettä.
Column-rule
Määrittelee sarakkeiden välisen leveyden, tyylin ja värin.

Selaimen tuki

Taulukossa olevat numerot osoittavat ensimmäisen selaimen version, joka tukee tätä ominaisuutta täysin.

Numerot, jotka sisältävät -webkit- tai -moz-, osoittavat ensimmäistä versiota, jota etuliitteellä käytetään.

Chrome IE / Edge Firefox Safari Opera
50.0
4.0 -webkit-
10.0 52.0
2.0 -moz-
9.0
3.1 -webkit-
37.0
15.0 -webkit
11.1