په CSS3 کې د مهمو بدلونونو درک کول
د CSS2 او CSS3 تر منځ ترټولو لوی فرق دا دی چې CSS3 په بیالبیلو برخو ویشل شوی، ماډولونه ویل کیږي. د دې ماډلونو هر یو د سپارښتنې پروسې په بیالبیلو مرحلو کې د W3C له لارې لاره کوي. دا پروسه د مختلفو مینوفیکچینډونو لخوا په براؤزر کې د مختلف CSS ټوټې CSS3 لپاره منل کیږي او منل کیږي.
که تاسو دا عمل د CSS2 سره څه وشو، چیرته چې هر څه د یو واحد سند په توګه د هغې په دننه کې د Cascading Style Sheets معلوماتو سره سپارل شوي، تاسو د کوچني، انفرادي ټوټو ته سپارښت مات ماتولو ته ګورو. ځکه چې هر یو ماډل په انفرادي توګه کار کوي، موږ د CSS3 ماډلونو لپاره د ډیری برنامو ملاتړ لرو.
د هر نوي او بدلیدونکي ځانګړتیا په توګه، ډاډه شئ چې خپل CSS3 پاڼې په ښه ډول د ډیری برائوزرونو او عملیاتي سیسټمونو کې چې تاسو یې کولی شئ ازمایښت کړئ. په یاد ولرئ چې هدف دا نه دی چې د ویب پاڼې جوړ کړئ چې په هر براؤزر کې په ورته توګه ورته ورته وي، مګر دا ډاډه کړئ چې کوم شیان چې تاسو یې کاروي، د CSS3 شالیدونو په شمول، هغه لټونونو کې خورا ښه وګورئ چې دوی ورسره مرسته کوي او دوی د غوره زاړه براؤزرونو لپاره راضي راځي مه کوه.
نوی CSS3 ټاکونکي
CSS3 د نويو لارو يوه ډله وړاندې کوي چې کولی شئ د نوي سي ایس ایس انتخابوونکو سره د سی ایس ایس قواعد ولیکئ، همداراز یو نوی ګډونکي، او ځینې نوی سیسو-عناصر.
درې نوې ځانګړتیاوې:
- د پیل تمرینات اصلي عنصر له ځانه سره لري [foo ^ = "bar"] عنصر یو خاصیت لري چې Foo د "بار" سره پیل کیږي مثال
- د پای پایګانې په سمه توګه عنصر [foo $ = "بار"] عنصر لري یو خاصیت foo دی چې د "بار" سره پای ته رسیږي.
- خصوصیت د میچ عنصر لري [foo * = "bar"] عنصر لري یو خاصیت foo په نوم دی چې د "بار" تار لري
د 16 نوي نوي تدریس:
- ريښه
- د لاسوند ریښی عنصر. په HTML کې دا تل وي.
- : نهه ماشوم
- د دې لپاره کار واخلئ چې د مناسبې ماشوم عناصر سره سمون ومومي یا د بدلو سیالیو ترلاسه کولو لپاره متغیر کاروئ.
- : nth-last-child (n)
- د ماشومانو سمبال عناصر چې د تیرې څخه راټیټ کړئ.
- د نهه ډوله ډول (n)
- د وروستي عناصرو سره د اسنادو د ونې په وړاندې ورته ورته نوم سره وپوښتئ.
- : nth-last-type-type (n)
- وروڼه عناصر د ورته نوم سره وپوښتئ چې د لاندې څخه ښکته راځي.
- وروستنی ماشوم
- د مور د وروستي ماشوم عنصر سره سمون ورکړئ.
- لومړنی ډول
- د دې ډول لومړنۍ وروستي عنصر سره وپوښتئ.
- وروستی ډول
- د هغه ډول وروستي وروستي عنصر سره سمون ورکړئ.
- یواځې ماشوم
- هغه عنصر سره وپوهئ چې د پلار یوازینی ماشوم دی.
- : یواځې ډول ډول
- هغه عنصر سره برابر کړئ چې د هغې یو ډول دی.
- خالي
- هغه عنصر سره برابر کړئ چې هیڅ ماشوم نلري (د متن نوډونو په ګډون).
- هدف
- یو عنصر سره وپوښتئ چې د اریانا د راجع کولو هدف وي.
- وړتیا
- کله چې فعال شوی وي عنصر سره برابر کړئ.
- معیوب
- کله چې معیوب شوی وي عنصر سره برابر کړئ.
- چک شوی
- کله چې چک شوی (عنصر راډیو تڼۍ یا چک بکس) عنصر سره برابر کړئ.
- : نه
- کله چې عنصر د ساده انتخاب کوونکی سره سمون نه خوري نو سره ملګری کړئ.
یو نوی مشترکونکی:
- عنصر A عنصر B
- کله چې عنصر ب د عنصر A څخه وروسته ځای کېږده سره سمون ورکړئ، حتمی نه.
نوې ځانګړتیاوې
CSS3 هم د نوي سی ایس ایس ځانګړتیاوې معرفي کړې. ډیری د دې ملکیتونو موخه دا وه چې د بصری ډولونو جوړونه وکړو چې احتمال یې د ګرافیک پروګرام په څیر د ګرافیک پروګرام سره نور هم شریک شي. ځینې یې، لکه د سرحد ریډیو یا د بکس سیوري، د سی ایس ایس 3 که چیرې د پیژندنې څخه وروسته وي. نور، لکه فلیکس بوکس یا حتی سی ایس ایس ګیډ نوي ډولونه دي چې لا تر اوسه هم د CSS3 اضافه ګڼل کیږي.
په CSS3 کې، د بکس نمونه بدل شوی نه دی. مګر د نوی طرزالعمل یوه ډله ده چې کولی شي ستاسو سره د بکسونو بیرغونو او سرحدونو سره مرسته وکړي.
یو څو پس منظر زه زیږم
د شاليد - انځور، پس منظر پوسټ، او پس منظر پسې شاليد کارولو سره تاسو کولی شئ د څو پس منظر انځورونه په نښه کړئ چې په بکس کې د يو بل په پورته کې پرتې وي. لومړی عکس د کاروونکي نږدې کېدی دی، لاندې لاندینیو انځورونو سره انځور شوي. که چیرې پس منظر رنګ شتون ولري، دا د ټولو تصویر پرتونو لاندې انځور شوي.
د نوې شاليد شاليد ځانتياوې
په CSS3 کې ځینې نوي پس منظر ځانونه شتون لري.
- پس منظر
- دا ملکیت تشریح کوي چې د شاليد انځور څنګه کتل کیږي. اصلي بڼه د سرحد بکس دی، مګر دا د بکسونو بکس یا د منځپانګې بکس ته بدلیدلی شي.
- د شاليد بنسټ
- دا ملکیت دا په ګوته کوي چې پس منظر باید د ګوتو په صندوق کې ځای وي، د سرحد بکس، یا د منځپانګې بکس.
- د شاليد اندازه
- دا ملکیت تاسو ته اجازه درکوي چې د شاليد انځور اندازه څرګند کړئ. دا تاسو ته اجازه درکوي چې کوچني انځورونه په پاڼه کې وټاکئ ترڅو وټاکل شي.
د اوسنۍ شاليد شاليد ځانګړتياوو کې بدلونونه
د شته مخابراتي طرزالعملونو کې یو څه بدلونونه شتون لري:
- پس منظر - تکرار
- د دې ملکیت لپاره دوه نوي ارزښتونه شتون لري: ځای او ګرد. ځای پرته له کټګۍ پرته په صندوق کې د ټیل شوی انځور ځای په ځای کوي. ګردي د شاليد انځور بيا ځاې کوي، ترڅو دا په صندوق کې ډېري وختونه تېل کړي.
- پس منظر
- یو نوی ارزښت "محلي" اضافه شوی دی، نو پس منظر به د عنصر له منځپانګې سره سم وګرځوي کله چې دا عنصر د کتاب پټه ولري.
- شاليد
- د شاليد شتمني ملکیت د اندازې او اصلي ملکیت کې اضافه کوي.
CSS3 Border Properties
په CSS3 سرحدونو کې کیدای شي هغه شالونه وي چې موږ یې کارول شوي (ټوټې، دوه ځله، ډوب شوي، او نور) یا دا یو انځور وي. برسیره پردې، CSS3 د ګرد کنډر جوړولو توان لري. د سرحد انځورونه په زړه پوري دي ځکه چې تاسو د ټولو څلورو سرحدونو انځور جوړوي او بیا CSS ته ووایی چې دا انځور ستاسو سرحدونو ته څنګه تطبیق کړئ.
د نوی سرحد اندازیتونه
په CSS3 کې ځینې سرحدي سرحدونه شتون لري:
- د سرحد راډیو
- سرحد - پورته ښي رګونه ، سرحد - لاندې - ښیګری رنګه ، سرحد - ښکته - بائیں - رګیوس ، سرحدی - پورته بائیں - رګراف
- دا ملکیت تاسو ته اجازه درکوي چې ستاسو په پولو باندې ګزمه کونړ جوړ کړي.
- د سرحد انځور - سرچینه
- د انځور سرچینه دوتنه مشخصوي چې د سرحدونو شالونو په ځای یې دمخه دمخه تعریف شوي.
- د سرحد انځور انځور
- د سرحد انځور کنډک څخه داخلي بندیزونه بیا تکراروي
- د سرحد انځور - چوک
- ستاسو د سرحد انځور لپاره چوکۍ ارزښت تعریف کړئ.
- د سرحد انځور انځور
- هغه اندازه مشخصوي چې د سرحد انځور ساحه د سرحدونو څخه بهر غزیدلې.
- د سرحد انځور انځور
- تشریح کوي چې د سرحدي تصویر اړخونه او منځنۍ برخې باید ټوټې یا ټوټې وي.
- د سرحد انځور
- د ټولو سرحدی عکس ملکیت لپاره د شتمنیو ملکیت.
د سرحدونو او پس منظرونو سره اړونده اضافی CSS3 پراخوالی
کله چې یو بکس په یوه پاڼه کې ویجاړ شوی وي، د قطار وقفې لپاره د ستنې وقف) د انډول عناصرو لپاره (د بکس - سجایا-وقایه توک ملکیت تشریح کوي چې نوي صندوقونه د سرحد او ګنډلو سره لرې لیږل کیږي. پس منظر د ډیرو بایللو بکسونو ترمنځ د دې ملکیت په کارولو سره ویشل کیدی شي.
دلته د بکس - سایډ شتمنۍ هم شتون لري چې د بکس عناصر ته سیوري اضافه کولو لپاره کارول کیدی شي.
د CSS3 سره، تاسو کولی شئ په اسانۍ سره د ویب پاڼې ډیری کالمونو پرته میزونو یا د ډی ټیکس پیچلي پیچلو سره تنظیم کړئ. تاسو په ساده ډول براؤزر ته ووایاست چې د بدن عنصر باید څومره وي او څومره پراخ باید وي. برسیره پردې تاسو کولی شئ سرحدونه (قواعد)، پس منظر رنګونه چې د کالم لوړوالی یې پراخ کړي، او ستاسو متن به په اتوماتيک کالونو کې راوباسي.
CSS3 کالم - د کالمونو شمیر او چوکۍ تعریف کړئ
درې نوي ملکیتونه شتون لري چې تاسو ته اجازه درکوي چې ستاسو د کالمونو شمیر او چوکۍ تعریف کړئ:
- کالم - چوک
- چوکۍ تعریف کړئ ستاسو ستونۍ باید وي. بیا به لټونګر متن ته ولېږدوي ترڅو هغه ځای ډک کړئ چې پراخه وي.
- د شمېره شمېره
- په پاڼه کې د کالمونو شمیره تشریح کوي. بیا برنامه به په هغه ځای کې د پوره کولو لپاره سترې سترې جوړې کړي، مګر یوازې هغه شمیر چې تاسو یې مشخص کړئ.
- کالمونه
- د شورتنډ ملکیت چیرته چې تاسو چوکۍ یا شمېره تعریف کړئ (یا دواړه، مګر دا په لږه اندازه احساس احساسوي).
د CSS3 کالم نیمګړتیاوې او مقررات
تشې او اصول د کالمونو تر مینځ په ورته څوم سایټیو کې ځای شوي دي. نیمګړتیا به ستونزونه جلا کړي، مګر قواعد هیڅ ځای نه اخلي. که د کالم حاکمیت د دې خلا په پرتله پراخه وي، نو دا به د نږدې غاړو په څنګ کې تکرار کړي. د کالم مقرراتو او تشو لپاره پنځه نوي ملکیت شتون لري:
- کالم فاصله
- د کالمونو ترمنځ د تشو چوکۍ تعریفوي.
- کالم - قاعده - رنګ
- د حاکمیت رنګ بیانوي.
- د کالم - قواعد طرزالعمل
- د حاکم طرز تعریف (ټک، ټوټه شوی، دوه، او نور).
- کالم - واک - چوک
- د حاکمیت چوکۍ تعریفوي.
- کالم قاعده
- د شتمني ملکیت یو ځل بیا د درې کالم قواعدو مشخصات تعریفوي.
CSS3 کالم توکی، د کالنګ سپنډ، او د کالمونو ډکول
د کالم ماتول د ورته سی ایس ایس 2 انتخابونو کارول د پیج شوي محتوا کې د توکیو د تعریفولو لپاره کارول کیږي، مګر د درې نوو ځانګړتیاو سره: مخکې له مخکې توقیف ، وقف وروسته ، او مات کړئ .
لکه د میزونو په څیر، تاسو عناصر کولی شي د کالمونو په اوږدو کې د کالم - span ملکیت سره ونیسئ. دا تاسو ته اجازه ورکوي چې سرلیکونه جوړ کړي چې ډیری کالمونه یې د ورځپاڼې په څیر زیاتوي.
د کالمونو ډکول پریکړه کوي چې په هر کالم کې څومره مواد به وي. بالقوه کالم هڅه کوي چې د هر کالم کې ورته مواد وساتي پداسې حال کې چې آٹو یوازې مواد په هغه وخت کې چې کالم ډک وي او بیا بل ته ځي.
په CSS3 کې نور ځانګړتیاوې چې د CSS2 په کې شاملې نه دي
په CSS3 کې ډیری اضافي بڼې شتون لري چې په CSS2 کې شتون نلري، په شمول:
- CSS CSS Template ترتیب او ماډل CSS3 د گرډ پوسټ کولو ماډل : د سی ایس ایس سره د گرډونو جوړول.
- CSS3 متن ماډل : د نقشه لیک لیکنه او حتی د سی ایس ایس سره د ډوډۍ سایج جوړ کړئ.
- د CSS3 رنګ ماډل : اوس د ناپاکتیا سره.
- د بکس موډل کې بدلونونه : د سمندری ملکیت په شمول چې د IE ٹیګ فعالیت کوي.
- د CSS3 کارن برسیر ماډل : تاسو ته نوي کرسر ورکول، د عملونو ځواب، اړین ساحې، او حتی د بیا رغونې عناصر .
- د رسنیو پوښتنو : د رسنیو سوالونه تاسو ته د لینډیټ پاڼه څنګه کارول کیدلو په اړه نور لچک وړتیا درکوي. د مثال په توګه، تاسو کولی شي د روش شیٹ تعریف کړئ چې یوازې د لاسي وسیلو لپاره دی چې د 20em څخه ډیر لیدونکي لري.
- د CSS3 روبی ماډل : د هغو ژبو لپاره ملاتړ چمتو کوي کوم چې د متناسب روبی کاروي د اسنادو توضیحات.
- CSS3 پېډل شوی رسنۍ ماډل : د پیډ میډیا لپاره د لازیاتې مرستې لپاره (کاغذ، شفافیت، او نور).
- تولید شوي محتويات : L د لارښوونکو سرپوهانو او فوټرانو، پټو پوښتنو، او نور محتوياتو چې پروګرامونه يې په ځانگړې توگه جوړ کړي، په تېره بيا د پديد رسنيو لپاره.
- CSS3 وینا ماډل : د ژور سی ایس ایس بدلونونه.