تب ها

شبکه ستون های متحرک

قالب شامل یک ست کامل شبکه CSS است به همراه 12 ستون متحرک و شیوه نوشتار بسیار ساده است :

1 ستون
11 ستون
2 ستون
10 ستون
3 ستون
9 ستون
4 ستون
8 ستون
5 ستون
7 ستون
6 ستون
6 ستون
7 ستون
5 ستون
8 ستون
4 ستون
9 ستون
3 ستون
10 ستون
2 ستون
11 ستون
1 ستون
12 ستون

چیز خاصی نبود! ها؟ اما استفاده از ستون های متحرک در یک طراحی واکنش گرا باعث میشود که ستون ها در صفحات موبایل خیلی, خیلی کوچک بوده و در واقع بی فایده باشند. خبر خوب این است که یک ست کلاس نیز برای تعیین اندازه برای هر عرض واکنش گرا در نظر گرفته شده تا شما بتوانید کاری کنید که محتوای شما برای هر اندازه ای به خوبی نمایش داده شود :

به عنوان مثال در یک صفحه عریض به ستون های زیر نگاه کنید، سپس صفحه مرورگر خود را تغییر سایز دهید تا ببینید چگونه به ردیف های مختلف تقسیم شده و همیشه فضای خالی باقی مانده را اشغال میکنند، بتون اینکه نسبت طول عرض آنها بهم بخورد :

1 ستون
1 ستون
2 ستون
3 ستون
5 ستون

ستون های ثابت

دو استایل ستون با سایز ثابت در دسترس است که واکنش گرا نیز هستند : در صفحه های کوچکتر، ستون با سایز ثابت در بالای ستون متحرک صف بندی میشود. مرورگرتان را تغییر سایز دهید تا این واکنش را مشاهده نمایید!

ستون با اندازه ثابت
ستون متحرک
ستون با اندازه ثابت
ستون متحرک