خصوصیت column-rule

چاپ

مثال (خصوصیت column-rule)

مشخص کردن رنگ، ضخامت، و استایل خطی که بین ستون ها قرار دارد:

div
{
column-rule:3px outset #ff00ff;
-moz-column-rule:3px outset #ff00ff; /* Firefox */
-webkit-column-rule:3px outset #ff00ff; /* Safari and Chrome */
}
خودتان امتحان کنید »

در انتهای این بیاموز، مثال های بیشتری را خواهید دید.


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

Internet Explorer Firefox Opera Google Chrome Safari

مروگرهای Internet Explorer 10 و Opera خاصیت column-rule را پشتیبانی می کنند.

مرورگر Fitefox خاصیت جایگزین moz-column-rule- را پشتیبانی می کند.

مرورگرهای Safari و Chrome خاصیت جایگزین webkit-column-rule- را پشتیبانی می کنند.

توجه: مرورگر Internet Explorer 9 و نسخه های قبلی آن، خاصیت column-rule را پشتیبانی نمی کند.


تعریف و کاربرد

خصوصیت column-rule در واقع فرم مختصر شده ای برای تنظیم تمام خاصیت های *-column-rule  می باشد.

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

مقدار پیشفرض medium none black
ارث بری خیر
نسخه CSS3
JavaScript ساختار object.style.columnRule="3px outset #ff00ff"

نحوه استفاده

column-rule: column-rule-width column-rule-style column-rule-color;
مقدارتوضیحات
column-rule-width  ضخامت (عرض) خط بین ستون ها را مشخص می کند.
column-rule-style استایل خط بین ستون ها را مشخص می کند.
column-rule-color رنگ خط بین ستون ها را مشخص می کند.

مثالs

مثال - خودتان امتحان کنید

Column-count

متن داخل عنصر div را به سه ستون تقسیم می کند.

Column-gap

متن داخل عنصر div را به سه ستون تقسیم می کند که فاصله بین هر ستون با دیگری 30 پیکسل است.


بیاموزهای مرتبط

 CSS3 Multiple Column (بیاموز CSS3)