Savybė column-rule

Savybė column-rule nustato sieną tarp stulpelių daugiaalstypiame tekste. Pagal priimamas reikšmes sutampa su savybe border.

Pavyzdys . Tipas solid

Šiame pavyzdyje tekstas bus suskirstytas į 3 stulpelius su sienomis tarp stulpelių solidžios linijos pavidalu, kurios storis 1px (atstumas tarp stulpelių susidarys automatiškai, kadangi nustatytas column-gap reikšmėje normal):

html<div id="elem">
  some long text
</div>
css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: normal;
  text-align: justify;
}

Результат:

Pavyzdys . Įtaka column-gap

Šiame pavyzdyje tekstas bus suskirstytas į 3 stulpelius su tarpu tarp jų 50px. Siena tuo tarpu eis per tarpo vidurį (į dešinę ir į kairę nuo sienos bus po 25px):

html<div id="elem">
  some long text
</div>
css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: 50px;
  text-align: justify;
}

Результат:

Taip pat žiūrėkite

  • savybė column-width,
    kuri nustato stulpelio plotį
  • savybė column-count,
    kuri nustato stulpelių skaičių
  • savybė column-gap,
    kuri nustato tarpą tarp stulpelių
  • savybė column-span,
    kuri nustato stulpelių skaičių, per kuriuos elementas turi tęstis
  • savybė columns,
    kuri yra sutrumpinta daugiaalstypiškumo savybė