الگو:ستونهای منعطف
این الگو در تعداد زیادی صفحه صفحه بهکار رفته است و تغییر دادن آن میتواند تأثیرات گستردهای داشته باشد. لطفاً تغییرات را در زیرصفحههای /تمرین یا /آزمایشی الگو، یا در زیرصفحهٔ کاربری خودتان بیازمایید. توصیه میشود که ابتدا در خصوص تغییرات مورد نظر در صفحهٔ بحث گفتگو کرده و سپس آنها را پیادهسازی کنید. |
این الگو از لوآ استفاده میکند: |
این الگو یک طرحبندی دوستونه ایجاد میکد که محتوای درون ستونهای آن دارای ارتفاع یکسان هستند و هرگونه فضای خالی نیز بین محتوای ستونهای کوتاهتر تقسیم میشوند. این الگو بیشتر برای استفاده در درگاهها طراحی شده است.
این نوع طرحبندی نیازمند پشتیبانی مرورگر از جعبهٔ انعطافپذیر سیاساس است. در مرورگرهایی که از این ویژگی پشتیبانی نمیکنند، ستونها بهصورت جفت نمایش مییابند، اما ارتفاع آنها یکسان نخواهد بود.
در صفحهنمایشهای باریک، برای مثال در دستگاههای همراه، نمایش بهصورت تکستونی خواهد بود.
استفاده
[ویرایش]{{ستونهای منعطف
|1 = (...محتوای ستون اول...)
|2 = (...محتوای ستون دوم...)
}}
تنها محتوایی که درون برچسبهای <div>...</div>
باشند دارای فضای خالی اضافی توزیعشده بین آنها خواهند بود – بهجز آنهایی که دارای کلاس flex-columns-noflex
(یا جایگزینی برای ویژگی flex:
) باشند.
برای تغییر تعادل ستونها، میتوان |منعطف۱=
و/یا |منعطف۲=
را تنظیم کرد. پیشفرض این پارامترها ۱
است. برای مثال:
|منعطف۱=۳ |منعطف۲=۲
باعث میشود که ستون اول تا ۶۰٪ (۳/۵) از عرض موجود، و ستون دوم تا ۴۰٪ (۲/۵) از عرض موجود را به خود اختصاص دهد.
دقت کنید که تعادل واقعی ستونها بسته به اندازهٔ صفحهٔ نمایش متغیر است؛ زیرا عرض حداقل برای هر ستون روی ۳۶۰ پیکسل تنظیم شده است.
نمونه
[ویرایش]{{ستونهای منعطف|{{طرحنما|3}}|{{طرحنما|2}}}}
Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo pharetra, est eros bibendum elit, nec luctus magna felis sollicitudin mauris. Integer in mauris eu nibh euismod gravida. Duis ac tellus et risus vulputate vehicula. Donec lobortis risus a elit. Etiam tempor. Ut ullamcorper, ligula eu tempor congue, eros est euismod turpis, id tincidunt sapien risus a quam. Maecenas fermentum consequat mi. Donec fermentum. Pellentesque malesuada nulla a mi. Duis sapien sem, aliquet nec, commodo eget, consequat quis, neque. Aliquam faucibus, elit ut dictum aliquet, felis nisl adipiscing sapien, sed malesuada diam lacus eget erat. Cras mollis scelerisque nunc. Nullam arcu. Aliquam consequat. Curabitur augue lorem, dapibus quis, laoreet et, pretium ac, nisi. Aenean magna nisl, mollis quis, molestie eu, feugiat in, orci. In hac habitasse platea dictumst.
Fusce convallis, mauris imperdiet gravida bibendum, nisl turpis suscipit mauris, sed placerat ipsum urna sed risus. In convallis tellus a mauris. Curabitur non elit ut libero tristique sodales. Mauris a lacus. Donec mattis semper leo. In hac habitasse platea dictumst. Vivamus facilisis diam at odio. Mauris dictum, nisi eget consequat elementum, lacus ligula molestie metus, non feugiat orci magna ac sem. Donec turpis. Donec vitae metus. Morbi tristique neque eu mauris. Quisque gravida ipsum non sapien. Proin turpis lacus, scelerisque vitae, elementum at, lobortis ac, quam. Aliquam dictum eleifend risus. In hac habitasse platea dictumst. Etiam sit amet diam. Suspendisse odio. Suspendisse nunc. In semper bibendum libero.الگوهای وابسته
[ویرایش]خانوادههای الگوهای تولیدکننده ستون
[ویرایش]الگوهای فهرستشده در اینجا با یکدیگر قابل تعویض نیستند. برای مثال، استفاده از {{col-float}} بههمراه {{پایان ستون}} بهجای {{col-float-end}} منجر به باز ماندن یک برچسب اچتیامال «div» (division) خواهد شد و احتمالاً به سایر قالببندیهای بعدی نیز صدمه خواهد زد.
نوع | خانواده | از کدهای جدول
ویکی پشتیبانی میکند؟ |
پاسخگو/ مناسب برای موبایل |
الگوی آغاز | جداکنندهٔ ستون | الگوی پایان |
---|---|---|---|---|---|---|
شناور | «ستون شناور» | آری | آری | {{ستون شناور}} | {{شکست ستون شناور}} | {{پایان ستون شناور}} |
«آغاز ستونها» | آری | آری | {{آغاز ستونها}} | {{ستون}} | {{پایان ستونها}} | |
ستونها | «چندستونه» | آری | آری | {{چندستونه}} | – | {{پایان چندستونه}} |
«فهرست چندستونی» | نه | آری | {{فهرست چندستونی}} (لفاف الگوی «چندستونه») | – | – | |
جعبه انعطافپذیر | «ستونهای منعطف» | نه | آری | {{ستونهای منعطف}} | – | – |
جدول | «col» | آری | نه | {{آغاز ستون}}، {{آغاز ستون ثابت}} یا {{آغاز ستون کوچک}} |
{{شکست ستون}} یا {{col-2}} .. {{col-5}} |
{{پایان ستون}} |
الگو با نشانهگذاری ویکی ابتدایی مشکلی نخواهد داشت{| | || |- |}
برای ساخت جدول از الگو استفاده کردهاید؟ اگر خیر، در عوض باید از الگوهای ویژهای که این عناصر (نظیر {{(!}}، {{!}}، {{!!}}، {{!-}}، {{!)}})—یا برچسبهای اجتیامال (<table>...</table>
، <tr>...</tr>
و غیره)— را تولید میکنند، استفاده کنید.