د ډیری کلونو لپاره، د سی ایس ایس الوتکو یو ویبټیټ، لا تر اوسه اړین دی، د ویب پاڼې د ترتیباتو په جوړولو کې برخه. که ستاسو ډیزاین د ډیری کالمونو لپاره نومول کیږي د دې کړنلارې ستونزه دا ده چې د ناقانونه وړتیا سره سره چې ویب ډیزاینرانو / ډیزاینرانو د پیچلي سایټونو ترتیبونو کې ښودل شوي، د سی ایس ایس الوتنې هیڅ کله هم پدې معنی نه کارول شوي.
پداسې حال کې چې لوټیږي او سی ایس ایس پوسټینګ د دې لپاره ډاډه دي چې د ډیرو کلونو لپاره په ویب ډیزاین کې ځای ولري، د CSS ګیډ او فلیکس بوکس په شمول نوي ترتیبونو تخنیکونه اوس د ویب ډیزاینرانو نوي ځایونه وړاندې کوي ترڅو د دوی ځای ځای جوړ کړي. د نوې نوي ترتیب تکنیک چې ښایي ډیری احتمالي امکانات یې د CSS ګڼو کالمونو دي.
CSS CSS کالونه د څو کلونو لپاره نږدې دي، مګر پر پخوانیو براؤزرونو کې د ملاتړ نشتوالی) (په واقعیت کې د انټرنیټ اکسپوریو پخوانی نسخه) د دې ډول کارونو څخه د دوی د تولید کار کارولو څخه ډیری ویب سایټونه ساتلي.
د IE د پخوانی نسخو لپاره د مالتړ پای، ځینې ویب ډیزاینر اوس د نوي CSS ترتیب انتخابونو تجربه کوي، CSS کالمونه شامل دي، او موندلي چې دوی د دې نوي تګلارو سره دومره لوړې کنترول لري چې دوی یې د لوټونو سره پرتله کړي.
د سی ایس ایس کالم اساسات
لکه څنګه چې د هغې نوم وړاندیز کوي، سی ایس ایس ګڼو کالمونو (چې د CSS3 ګڼ کالم لیډ په نامه هم پیژندل شوی) تاسو ته اجازه درکوي چې د منځپانګې ویش د یو شمېر شمېرو کې وویشئ. د سی ایس ایس ترټولو لومړنۍ ځانګړتیاوې چې تاسو یې کاروئ عبارت دي له:
- د شمېره شمېره
- کالم فاصله
د شمېرنې د شمار لپاره، تاسو د هغه کالم شمیره چې تاسو یې غواړئ مشخص کړئ. د ستون کال خلا به د ګوتو او یا د هغو د ستنو تر مینځ فاصله وي. براؤزر به دا ارزښتونه واخلي او محتويات په مساوي ډول د هغو ستونځو شمیر ته چې تاسو یې مشخص کړئ ویشئ.
په عمل کې د سی ایس ایس ډیری کالمونو یوه عام مثال به د متن متن منځپانګې په ډیرو کالمونو ویشل شي، ورته ورته ورته چې د ورځپاڼه مقالې کې یې وګورئ. ووایاست چې تاسو لاندې HTML مارک اپ لرئ (یادونه وکړئ چې د مثال په توګه، زه یوازې د یوې پیراګراف پیل کوم، په داسې حال کې چې ممکن په دې مارکپټ کې د محتوا ډیری پراګرافونه وي):
ستاسو د مضمون سرلیک
دلته د متن ډیری پراګراف تصور کړئ ...
که تاسو بیا دا سی ایس ایس شیلی لیکلی:
.content {-moz- کالم - شمیره: 3؛ د ویب پاڼه-کال-شمېره: 3؛ د شمېره شمېره: 3؛ -Moz-column-gap: 30px؛ -webkit-column-gap: 30px؛ کالم - فاصله: 30px؛ }دا سی ایس ایس اصول به "منځپانګې" ویش په 3 برابر کالمونو کې تقویه کړي چې د دوی تر مینځ 30 پکسلونه وي. که تاسو د 3 په ځای دوه کالم غواړئ، نو تاسو به په ساده ډول د ارزښت ارزښت بدل کړئ او براؤزر به په مساوي ډول د منځپانګو نوي چوکۍ محاسبه کړي ترڅو په مساوي ډول تقسیم شي. په یاد ولرئ چې موږ د پلورونکي وړاندیز شوي ځانګړتیاوې لومړی په کاروئ، وروسته د غیر وړاندې شوي بیانونو.
څومره چې اسانه وي، په دې ډول کارول د ویب پاڼې کارولو لپاره د پوښتنې وړ دي. هو، تاسو کولی شئ په ډیرو کالمونو کې د منځپانګې ډوډۍ وویشئ، مګر دا کیدای شي د ویب لپاره د لوستلو غوره تجربه نه وي، په ځانګړي ډول که د دې کالمونو لوړوالی د سکرین د "فول" لاندې راشي.
نو بیا به لوستونکي د بشپړ منځپانګې د لوستلو لپاره پورته او ښکته کړي. بیا هم، د سی ایس ایس کالم مینځل دومره اسان دی چې تاسو دلته وګورئ، او دا د ځینو پیراگرافونو محتويات تقویه کولو څخه دومره ډیر کار کولو لپاره کارول کیدی شي - دا، په حقیقت کې، د لیډ لپاره کارول کیږي.
د سی ایس ایس کالمونو سره ترتیب
ووایاست چې تاسو د منځپانګې ساحې سره یو ویب پاڼه لرئ چې د منځپانګې 3 کالم لري. دا یو ډیر عام ویب پاڼه ترتیب دی، او د دې 3 کالمونو تر لاسه کولو لپاره، تاسو به په هغه ځای کې هغه برخې وټاکئ چې په کې دي. د CSS ډیری کالمونو سره، دا خورا اسانه اسانه ده.
دلته یو څه نمونه HTML دی:
د منځپانګې دلته به ...مواد به دلته لاړ شي
راتلونکی واقعیت
مواد به دلته لاړ شي ...
د دې ګڼ شمیر کالمونو د جوړولو لپاره سي ایس ایس هغه څه پیل کوي چې تاسو یې مخکې ولیدل:
.content {-moz- کالم - شمیره: 3؛ د ویب پاڼه-کال-شمېره: 3؛ د شمېره شمېره: 3؛ -Moz-column-gap: 30px؛ -webkit-column-gap: 30px؛ کالم - فاصله: 30px؛ }اوس، ننګونې دلته دا دي چې له دې امله چې برنر غواړئ دا محتويات په مساوي ډول وویشئ، نو که چیرې د دغو فرعي منځپانګو بیلابیل وي، نو هغه براؤزر به په حقیقت کې د انفرادي ویش منځپانګې تقویه کړي، د هغې پیل به په یوه کالم کې شامل کړي. بیا بیا بل ته دوام ورکړئ (تاسو د دې کود کارولو لپاره د تجربې د چلولو لپاره کاروئ او د هرې برخې په دننه کې د مختلفو منځپانګو اضافه کړئ)!
دا هغه څه نه دي چې تاسو یې غواړئ. تاسو غواړئ چې هر یو فرعي برخې یو جلا کالم رامینځ ته کړئ او هیڅ توپیر نلري چې د انفرادي ویش څومره لوی یا کوچنی وي، تاسو هیڅکله دا ویش نه غواړئ. تاسو کولی شئ د دې سی ایس ایس یو اضافي لین اضافه کولو سره دا ترلاسه کړئ:
.نټینټ ډی {نمونه: انډول - بلاک؛ }دا به هغه برخې تقویه کړي چې د "منځپانګې" دننه وي ځکه چې پاتې پاتې دي حتی لکه څنګه چې لټونګر دا دا په ډیری کالمونو ویشلې. حتی لاهم ښه، ځکه چې موږ دلته یو ثابت چوکۍ نه دی ورکړلی، دا کالمونه به په خپل ځان سره د براؤزر بدلون راشي، او د ځواب ورکوونکي ویب پاڼې لپاره انډول غوښتنلیک جوړ کړي. د هغه "انډول - بلاک" طرز سره په ځای کې، ستاسو دری 3 ویشونه د منځپانګې یو جلا کالم وي.
د کالم چوکۍ کارول
دلته د "ستوري - شمېرنې" پرته بل بل ملکیت شتون لري چې تاسو یې کارولی شئ، او ستاسو د لیډ اړتیاوو ته اړتیا لري، دا ممکن ستاسو د سایټ لپاره غوره انتخاب وي. دا "ستون - چوک" ده. د ورته HTML مارک اپ کارول لکه څنګه چې مخکې ښودل شوي، موږ کولی شو دا زموږ د CSS سره ترسره کړو:
.content {-moz-column-width: 500px؛ -webkit-column-width: 500px؛ کالم - چوکۍ: 500px؛ -Moz-column-gap: 30px؛ -webkit-column-gap: 30px؛ کالم - فاصله: 30px؛ } .نټینټ ډاټا {نمونه: انډول - بلاک؛ }هغه لار چې دا کار دا دی چې براؤزر د "کالم-چوک" څخه د هغه ستونزمن حد په توګه کاروي. نو که چیرې د براؤزر کړکۍ له 500 پکسلونو څخه کم وي نو دا درې برخې به په یو واحد کالم کې وي چې د بل تر ټولو پوستونه وي. دا یوه عادي بڼه ده چې د ګرځنده / کوچني سکرین اسباب لپاره کارول کیږي.
لکه څنګه چې د برنر چوکۍ ډیرې لوړې وي چې د 2 کالمونو سره د ټاکل شوي کالم نیمګړتیاو سره سمون ولري، براؤزر به په اوتومات ډول د یو واحد کالم ترتیب څخه دوه پوستونو ته لاړ شي. د سکرین چوک ته وده ورکړئ او بالاخره، تاسو به د 3 کالم ډیزاین ترلاسه کړئ، زموږ هره درې ویشنونه چې په دویم کال کې ښودل شوي. بیا بیا، دا د ځینو ځواب ورکوونکو، څو ډیزاین دوستانه ترتیبونو ترلاسه کولو لپاره یوه غوره لار ده ، او تاسو حتی د لیډیټ طرزونو بدلولو لپاره د رسنیو پوښتنو ته هم اړتیا نه لرئ!
د بل کالم ځانګړتیاوې
د هغه شتمنیو سربیره چې دلته پوښل شوي، د "کالم - قوا" لپاره ځانګړتیاوې هم شتون لري، د رنګ، اندازې او چوک ارزښتونه پکې شامل دي چې تاسو ته ستاسو د کالمونو ترمنځ قواعد رامنځته کولو کې اجازه درکوي. دا به د سرحدونو پرځای وکارول شي که چیرې غواړئ چې ځینې لینونه ستاسو د کالمونو جلا کول.
تجربه کولو وخت
اوس مهال، د سی ایس ایس ګڼ شمیر کالم لیټ خورا ښه ملاتړ شوی دی. د لومړیتوبونو سره، د 94٪ څخه زیات د کاروونکو کاروونکي به دا ډول ډولونه وګوري، او دا چې نه ملاتړ شوي ډلې واقعا به د انټرنیټ اکسپورډ خورا پخوانۍ نسخه وي چې تاسو به په هرصورت سره ملاتړ ونه کړئ.
د دې کچې سره په اوس وخت کې، هیڅ دلیل شتون نلري چې د CSS کالمونو سره تجربه کولو پیل او د دې اندازې جوړولو لپاره په تولیداتو کې چمتو شوي ویب پاڼې. تاسو کولی شئ په دې مقاله کې وړاندې شوي HTML او CSS په واسطه خپل تجربې پیل کړئ او د مختلفو ارزښتونو سره لوبې وکړئ ترڅو وګورئ چې ستاسو د سایټ د لیډ اړتیاوو لپاره به غوره کار وکړي.