خصوصیت column-fill
مثال (خصوصیت column-fill)
مشخص کردن نحو پر کردن ستون ها:
div
{
column-fill:auto;
}
{
column-fill:auto;
}
در انتهای این بیاموز، مثال های بیشتری را خواهید دید.
پشتیبانی مرورگرها
هیچ یک از مرورگرهای اصلی، خصوصیت background را پشتیبانی می کنند.
تعریف و کاربرد
با استفاده از خصوصیت column-fill مشخص می کنیم که نحوه پر شدن ستون ها به صورت متوازن (balanced) باشد یا خیر.
| مقدار پیشفرض | balance |
|---|---|
| ارث بری | خیر |
| نسخه | CSS3 |
| JavaScript ساختار | object.style.columnFill="auto" |
نحوه استفاده
column-fill: balance|auto;
| مقدار | توضیحات |
|---|---|
| balance | ستون ها متوازن هستند. مروگر بایستی اختلاف طول ستوه ها را کم کند. |
| auto | ستون ها به صورت متوالی پر می شوند و هر کدام طول متفاوتی نسبت به دیگری دارد. |
مثال - خودتان امتحان کنید
متن داخل عنصر div را به سه ستون تقسیم می کند.
متن داخل عنصر div را به سه ستون تقسیم می کند که فاصله بین هر ستون با دیگری 30 پیکسل است.
عرض، استایل و رنگ خط کشی که بین هر دو ستون قرار دارد را مشخص می کند.
بیاموزهای مرتبط
CSS3 Multiple Column (بیاموز CSS3)
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 6406
