10 ط£ط¯ظˆط§طھ ظ…ظپظٹط¯ط© ظ„طھط³ظ‡ظٹظ„ ط§ظ„طھطµظ…ظٹظ… ط¨ظ€ CSS3 ( ط¹ط´ط± ظ…ظˆط§ظ‚ط¹ ظ„طھطµظ…ظٹظ… ط§ظƒظˆط§ط¯ CSS3 ) .
بسم الله الرحمن الرحيم.
السلام عليكم ورحمه الله وبركاته.
في الواقع، CSS3 هي تطور عظيم لخواص التصميم و CSS القديمة، لقد أتاحت لمطوري الوب إضافة تأثيرات جمالية كثيرة لمواقعهم، بدون إصابة الرأس بصداع. عدة أدوات يمكن أن تختصر الوقت وتساعدك بشكل كبير على تصميم موقعك مع CSS3، في هذه المقالة، قمت بتجميع أكثر 10 أدوات قد تكون مفيدة لك جداً ومساعدة في التصميم.
1- CSS3 Pie
هل تفاجأت لأن دعم مستعرض الانترنت (IE 6+) شبه معدوم، للأسف قد يصادفك وجود زبون يريد منك أن تصمم موقعه كي يظهر كما في المستعرضات الحديثة، لكنك فكرت أن ذلك لا يمكن في IE, إذاً إليك الحل, موقع CSS3 Pie يخوّلك للقيام بأغلب خواص الإصدار الثالث من CSS على IE.
-----
2- CSS3 Builder
يستخدم هذا الموقع واجهة interface تفاعلية تشبه تماما واجهة interface برنامج الفوتوشوب (PhotoShop) تستطيع من خلاله تصميم مربعات جميلة جداً. أداة تفيد في حفظ الوقت بشكل رهيب.
-----
3- CSS3 Drop shadow generator
هذا الموقع يشبه جداً الموقع السابق إلا أنه في هذا الموقع يوجد مزلق تستطيع به التحكم تفاعلياً، كما تستطيع تحديد عرض وارتفاع المربع. قم بنسخ الكود code الذي تلقاه في الأسفل واستمتع !
-----
4- Cascader
هذه الأداة, بالحقيقة, ليست مخصصة لـ CSS3 بشكل خاص، بل CSS بشكل عام، إذا كان لديك ملف HTML مضمن بداخله تعليمات CSS، وأنت تريد فصل الـ CSS عن الكود code الأساسي، فهذه الأداة موجهة لفعل ذلك. أداة رائعة فعلاً.
------
5- Border Radius.com
خاصية border-radius واحدة من أهم الخاصيات الجديدة في CSS3، هذه الأداة تجعلك قادر على صنع المربعات بسرعة والحصول على كود code الـ CSS3.
-----
6- Button Maker
أداة رائعة وسهلة تستخدم CSS3 لصنع أزرار من الممكن استخدامها حيثما تشاء، فقط قم باختيار الألوان وحدد مقدار انحناء الحواف, واحصل على الكود code جاهز لاستخدامه في موقعك.
-------
7- CSS3 Generator
هذا الموقع لديه أغلب خواص CSS3، كما يظهر لك أن هذه الميزة تعمل على المتصفحات من الإصدار كذا وفوق مثلاً.
------
8- Modernizr
هو سكربت يكشف إذا كان المتصفح يدعم CSS3، فإذا كان يدعم فإنه يطبق تعليمات CSS المحددة، وإلا فإنه سيطبق تعليمات CSS التي تحددها أنت إذا لم يكن المتصفح يدعم CSS3، أي ببساطة يشبه الشرط (إذا كان فافعل وإلا).
------
9- HTML 5 & CSS3 Support
هل تريد أن تعرف هل إنترنت إكسبلورر يدعم خاصية text-shadow مثلا؟ فقط ألق نظرة على هذا الموقع الذي يحدد المتصفحات والخواص التي تدعمها.
------
10- ورقة غش CSS3
عندما تقوم بكتابة الأكواد, فورقات الغش تكون مفيدة جداً كي تتذكر بعض الخصائص وبناء الجمل, قامت مجلة Smashing بإصدار هذه الورقة من الغش لـ CSS3، بإمكانك تحميلها وطباعتها، هنا(اضغط الزر اليمين ثم حفظ باسم) .
------
هذه المقالة مترجمة بتصرف من المصدر . نقل من f-bawadekji ~
اتمنى منكم الاستفاده من المواقع
اخوكم اورجينال .
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©
رد مع اقتباس
