لست مصمما بالدرجة الأولى وكنت أود أن أعرف أهم 5 ميزات جديدة في CSS3؟
ما الجديد في CSS3؟
أتت الـCSS3 بالكثير من التطورات، نذكر أهم هذه التطورات،
1. Animations and Transitions
قدمت لنا CSS3 خاصية جديدة وهي الحركات والأنميشين، بحيث يمكن للأشياء أن تتفاعل مع المستخدم، بدل استخدام flash وهي أسرع وأفضل، وأسهل
2. Gradients
كخاصية جديدة أخرى أتت وهي إضافة التدرجات، والتي يمكن إضافتها بكود بسيط بدل صنع صورة خاصة ووضعها
3. Webfonts
خاصية أخرى وهي إدراج خطوط خاصة، ففي النسخ السابقة كان المصمم يلتزم بخطوط المتصفح المملة، أو حتى إدراج صور بدل بعض الكتابات، اما الآن فيمكن إضافة الخطوطو بسهولة عبر @font-face
4. Border Images
وهي تسمح لك بإضافة صورة كمثابة إطار للعناصر، بدل الإطار الخطي
5. Multiple Backgrounds
وهي تسمح لك بإضافة أكثر من خلفية لنفس العنصر، لتحكم أفضل وأسهل
بالطبع هناك العديد من الخواص الجديدة في CSS3 لكن هذه هي أكثرها شيوعا وأفضلها
هذه بعض المقالات التي تتحدث عن الجديد فيها
فعلاً، وأعتقد أن أهمها هي الـ Web Fonts.
وأضيف:
6- التصميم التجاوبي: إمكانية تخصيص الصفحة حسب حجم الشاشة المستخدمة.
7- الإمكانيات المخصصة للطباعة: المعايير موجودة، ولكني أنتظر دعم المتصفحات لها بفارغ الصبر!
التصميم التجاوبي لم يكن خاصية جديدة أضيفت لCSS3 بل هو مجموعة من الخيارات والأكواد البسيطة المدروسة بعناية ليكون التصميم متوافقا،
max-width
min-height
وشبيهاتها، كانت موجودة من قبل، لكن استعمالها ظهر جليا مؤخرا مع التصميم المتجاوب
1- animation & transition : هذه الخواص الرهيبه التى مكنتنا من الاستغناء عن الفلاش وغيرها من الادوات والتى جعلتنا قادرين على عمل تاثيرات الحركه والنقل فى موقعنا او صفحتنا مما يضيف للصفحه شكل انسيابى جميل ويشعر المستخدم بشئ من الرفاهيه
2- Gradiants : وهو التدرج اللونى الذى جعلنا ف غنى عن استخدام الفوتوشوب لعمل خلفيه بها تدرج لونى ما مما كان يتسبب ف ثقل حجم الصفحه نتيجة الصور الكثيره المرفقه
3- Border-image : هذه الخاصيه الاخرى مكنتنا من استخدام صوره فى الاطار بدلا من شكل الاطار الاعتيادى مما يضيف ايضا شيئا من الجمال للموقع
4- Multiple Backgrounds : وهذا ايضا من اكثر الاشياء جمالا حيث جعل بالامكان وضع اكثر من خلفيه لنفس العنصر والتحكم فيهم كيفما شئت
5- الالوان ب hsla وهى اختصار ل hue & saturation & lightness& alpha وهما درجة اللون ودرجة التشبع للون والاضاءه وال alpha هذه للشفافيه
6- border-radius : هذه الخاصيه ايضا تضيف لمسه جماله للاطارات حيث تستخدم فى عمل اركان المربع على شكل قوس والاستغناء عن الاشكال المعتاده
7- box shadows : وهذه ايضا من اللمسات الجماليه الاخرى مما يعطى المستخدم شيئا من الاحساس بالرفاهيه عند التعامل مع الصفحه او الموقع ويعطيه شيئا من الواقعيه
8- text shadows : ايضا اضافه مميزه
9: @font-face: من اهم الاضافات والتى عاجلت مشكله كبيره جدا لدى المبرمجين ومصممى المواقع حيث كنا قبل CSS3 نستخدم خطوط المتصفح العقيمه والتى لابد ان نتقيد بها وعند استعمال خطوط اخرى كان يتوجب على المستخدم النهائى للموقع من تواجد الخط على جهازه مما كان يتسبب فى تدمير شكل الموقع لدى المستخدمين
التعليقات