column-rule-width

از ویژگی column-rule-width برای تعیین عرض خطی که بین ستون های چیدمان چندستونی رسم شده، استفاده می شود.

این خط یا همان Rule تا حدودی شبیه به border است که بین ستون ها قرار می گیرد و حتی می توان استایل این خط را نیز شبیه به استایل های حاشیه یک عنصر تغییر داد.

این خط تنها بین ستون ها رسم می شود این یعنی قبل از اولین ستون و بعد از آخرین ستون رسم نخواهد شد.

این خط هیچ فضایی اشغال نمی کند، یعنی اندازه فاصله بین ستون ها (column-gap) را تحث تاثیر قرار نمی دهد و وسط آن فضا رسم می شود.

مقادیر ویژگی column-rule-width

column-rule-width: <length> | thin | medium | thick;

مقدار اولیه و پیشفرض این ویژگی medium می باشد.

مقدار این ویژگی می تواند یک عدد با واحد طولی باشد یا اینکه یکی از کلمات کلیدی medium، thin و thick باشد. که این کلمات به ترتیب به معنی نازک، معمولی و ضخیم می باشند.

.example {
    columns: 14em;
    column-rule-width: 5px;
    column-rule-style: solid;
    column-rule-color: #cbd8e7;
}

مثال

در دموی زیر این ویژگی را بررسی کنید:

See the Pen column-rule by Mojtaba Seyedi (@seyedi) on CodePen.

پشتیبانی مرورگر ها