صفحات الطرز المتراصة

ملف:CSS.svg

صفحات الطرز المتراصة (بالإنجليزية Cascading Style Sheets، واختصارًا CSS) هي لغة تنسيق لللصفحة تتهتم بشكل وتصميم المواقع، صممت خصيصا لعزل التنسيق (الألوان - الخطوط....) عن محتوى المستند المكتوب (بلغة مثلا html) وينطبق ذلك على الألوان والخطوط والصور والخلفيات التي تستخدم في الصفحات، بمرونة وسهولة تامه.

هذه التقنية تعني بشكل صفحات المواقع;المظهر الكلي من الوان وصور وغيره.

أطلقها مجلس وب W3C، كمواصفة قياسية لتوصيف مظهر وثائق وب من محددات للخطوط والألوان والتنسيق.

مميزات تقنية CSS

تهدف تقنية CSS إلى فصل محتوى الصفحات عن مظهرها بحيث يعطي عدة مكاسب :

  • جعل الصفحة ابسط وتفيد فقط ماعملت من اجله بحيث تشمل المحتوى, اما الشكل فيكون في ملف الانماط CSS.
  • جعل الصفحة قابله للتعامل مع عدة متصفحات أو شاشات عرض مختلفه ويمكن معالجة كل جهاز (حاسوب أو حتى هاتف نقال) أو متصفح على حده وبالتالي قابلية استخدام أكبر.
  • يمكن وضع عدة مظاهر كل مظهر يلبي حاجة كل قارى فمثلا يمكن ضمان قابلية الاستخدام لذوي الاحتياجات الخاصه أو وضع عدة الوان لتلبيه اذواق شتى.
  • يمكن لملف الانماط ان يتم تضمينه في عدة صفحات وبالتالي عند تغيير شكل العرض فانك تحتاج لتعديل ملف واحد فقط وهذا يعني وقت اقل وتعديل أكبر واشمل.

نظم كتابة ال CSS

كود ال CSS هو مجموعة من التعريفات لكل عنصر، وبالتالي يمكن ان يكون لدينا 100 تعريف ل 100 عنصر وهكذا

كل تعريف يكون بادئ باسم أو تعريف العنصر (كـ id أو class العنصر)

فمثلا لنأخذ العنصر div

الذي يكتب بـ HTML كـ


<div id="ar_wiki">اهلا وسهلا بالويكي العربي</div>

سنقوم بإعطاء هذا العنصر لونا ازرق، كما نرى بالأعلى ان عنصر ديف تم تعريف بالـ ID كـ ar_wiki وبالتالي يتم كتابته كـ #ar_wiki بصفحة الانماط

لان كل عنصر يتم تعريف بالID يكون قبله (#) واي عنصر يتم تعريف بclass يكون قبله نقطة (.) عند كتابته بصفحة الانماط.

وبالتالي يكون الشكل التالي هو التعريف لإعطاء العنصر اللون الازرق :

#ar_wiki { color:blue; }

والتالي هو شرح الكود :

  • #ar_wiki : تعريف العنصر المراد تطبيق التنسيق عليه، وهو ماتم تعريف بصفحة ال HTML لعنصر div.
  • {...} كل تنسيق يتم احاطته بهذه الاقواس المعكوفه لتوضيح تنسيق كل عنصر على حده.
  • color : هي صفة التنسيق المراد تطبيقه على العنصر، وهنا تم وضع color اي اللون.
  • (:) : توضع النقطتين الرئسيتين لتوضح ان ما بعدها هو قيمة الصفة، وبالتالي هي فاصل بين الصفة وقيمتها.
  • blue : قيمة للصفة وهنا تم وضع القيمة blue اي الازرق للصفه color اللون.
  • (;) : يتم وضع النقطة المنقوطة بعد القيمة لأخبار المعالج ان القيمة انتهت وما سيأتي بعدها هو صفة أخرى وهكذا..

برامجة وتحريره

CSS هي تقنية لتطوير الويب وكما أغلب التقنيات للويب، هذه التقنية نصية، اي ان البرامج النصيه كـ نوتباد في ويندوز أو Gedit في واجهة جنوم لينكس جنو، يمكنك الكتابه بها بكل سهولة.

هناك برامج تسهل عملية الكتابة وتعطي خيارات أكثر، مثل دريم ويفر أو Microsoft® Expression® التجاريان، ولكن يظل الخيار النصي للمطورين هو الأفضل، لان إنشاء هذه القيم تلقائيا غير محبب لمطوري الويب المهوسوون بمعايير الويب.

اصداراته

الإصدار العامل حاليا من تقنية CSS هو الإصدار 2.1، ويجري العمل على الإصدار 3.

المتصفحات والدعم الخاص فيه

تدعم متصفحات وب المواصفة بدرجات مختلفة من الكفاءة والتوافقية؛ فبينما يدعم كل من فيرفكس ومتصفح أوبرا المواصفة بدرجة معقولة، وبالنسبة لمتصفح إنترنت إكسبلورر فيتوقع منه نسخة جديدة معدلة لتناسب وتلبي احتياجات الويب حاليا ومايكروسوفت أعلنت عند طرحها إصدارا جديدا من متصفح إنترنت إكسبلورر (IE7) مشتملا على الكثير من الإضافات التي تجعل تصفح الإنترنت أكثر أمانا، ومنها تطبيقات مضادة لبرامج التجسس (spyware) والفيروسات ومواقع الاحتيال حيث تم بالفعل إصدار النسخة السابعة من [ متصفح إنترنت إكسبلورر ] وتم بعده إصدار نسخة جديدة تحمل الرقم 8 ويجري في هذه الاوقات الاستعداد لإصدار نسخة جديدة منه حيث لاقت النسخ القديمة من المتصفح غضب العديد من الأشخاص والعديد من الشركات.

وصلات خارجية

az:CSS bar:CSS bat-smg:CSS bg:CSS bs:CSS ca:Cascading Style Sheets cs:Kaskádové styly cy:Cascading Style Sheets da:CSS de:Cascading Style Sheets diq:CSSê xasi el:CSS Cascading Style Sheets]] eo:CSS es:Hojas de estilo en cascada et:CSS eu:CSS fa:برگه‌های سبک آبشاری fi:Cascading Style Sheets fr:Feuilles de style en cascade ga:Stílbhileoga cascáideacha gd:CSS gl:CSS he:גיליונות סגנון מדורגים hr:CSS hsb:CSS hu:CSS hy:Կասկադային ոճաթերթ id:Cascading Style Sheets is:Cascading Style Sheets it:CSS ja:Cascading Style Sheets kaa:Css ko:종속형 시트 la:CSS lt:CSS lv:Cascading Style Sheets ml:കാസ്‌കേഡിങ്ങ് സ്റ്റൈൽ ഷീറ്റ്‌സ് ms:Cascading Style Sheets my:စီအက်စ်အက်စ် nl:Cascading Style Sheets nn:Stilark no:Cascading Style Sheets pl:Kaskadowe arkusze stylów pt:Cascading Style Sheets ro:Cascading Style Sheets ru:Каскадные таблицы стилей sh:CSS simple:Cascading Style Sheets sk:Kaskádové štýly sl:CSS sq:Fletat e Stileve të Shkallëzuar sr:CSS sv:Cascading Style Sheets ta:விழுத்தொடர் பாணித் தாள்கள் th:แคสเคดดิงสไตล์ชีตส์ tk:CSS tr:Cascading Style Sheets uk:CSS vi:CSS zh:层叠样式表