سبد (0)

خصوصیت column-gap

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

مشخص کردن فاصله یا شکاف 40 پیکسلی بین ستون ها:

div
{
column-gap:40px;
-moz-column-gap:40px; /* Firefox */
-webkit-column-gap:40px; /* Safari and Chrome */
}
خودتان امتحان کنید »

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


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

Internet Explorer Firefox Opera Google Chrome Safari

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

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

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

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


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

با استفاده از خاصیت column-gap می توانیم میزان فاصله (شکاف) بین هر دوستون را مشخص کنیم.

توجه: اگر خط کشی بین ستون ها بود، آن در وسط فاصله (شکاف) بین دو ستون قرار می گیرد. 

مقدار پیشفرض normal
ارث بری خیر
نسخه CSS3
JavaScript ساختار object.style.columnGap="40px"

نحوه استفاده

column-gap: length|normal;
مقدار توضیحات نمایش دادن
length

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

نمایش دادن »
normal یک فاصله نرمال بین ستون ها مشخص می کند. W3C مقدار 1em را پیشنهاد می دهد. نمایش دادن »

مثالs

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

Column-count

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

Column-gap

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

Column-rule

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


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

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

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه