بسم الله الرحمن الرحيم .
السلام عليكم ورحمه الله وبركاته .
في الواقع، CSS3 هي تطور عظيم لخواص التصميم و CSS القديمة، لقد أتاحت لمطوري الوب إضافة تأثيرات جمالية كثيرة لمواقعهم، بدون إصابة الرأس بصداع. عدة أدوات يمكن أن تختصر الوقت وتساعدك بشكل كبير على تصميم موقعك مع CSS3، في هذه المقالة، قمت بتجميع أكثر 10 أدوات قد تكون مفيدة لك جداً ومساعدة في التصميم.
1- CSS3 Pie
هل تفاجأت لأن دعم مستعرض الانترنت (IE 6+) شبه معدوم، للأسف قد يصادفك وجود زبون يريد منك أن تصمم موقعه كي يظهر كما في المستعرضات الحديثة، لكنك فكرت أن ذلك لا يمكن في IE, إذاً إليك الحل, موقع CSS3 Pie يخوّلك للقيام بأغلب خواص الإصدار الثالث من CSS على IE.
السلام عليكم ورحمه الله وبركاته .
في الواقع، CSS3 هي تطور عظيم لخواص التصميم و CSS القديمة، لقد أتاحت لمطوري الوب إضافة تأثيرات جمالية كثيرة لمواقعهم، بدون إصابة الرأس بصداع. عدة أدوات يمكن أن تختصر الوقت وتساعدك بشكل كبير على تصميم موقعك مع CSS3، في هذه المقالة، قمت بتجميع أكثر 10 أدوات قد تكون مفيدة لك جداً ومساعدة في التصميم.
1- CSS3 Pie
هل تفاجأت لأن دعم مستعرض الانترنت (IE 6+) شبه معدوم، للأسف قد يصادفك وجود زبون يريد منك أن تصمم موقعه كي يظهر كما في المستعرضات الحديثة، لكنك فكرت أن ذلك لا يمكن في IE, إذاً إليك الحل, موقع CSS3 Pie يخوّلك للقيام بأغلب خواص الإصدار الثالث من CSS على IE.
CSS3 Pie
-----
2- CSS3 Builder
يستخدم هذا الموقع واجهة تفاعلية تشبه تماما واجهة برنامج الفوتوشوب (PhotoShop) تستطيع من خلاله تصميم مربعات جميلة جداً. أداة تفيد في حفظ الوقت بشكل رهيب.
CSS3 Builder
-----
3- CSS3 Drop shadow generator
هذا الموقع يشبه جداً الموقع السابق إلا أنه في هذا الموقع يوجد مزلق تستطيع به التحكم تفاعلياً، كما تستطيع تحديد عرض وارتفاع المربع. قم بنسخ الكود الذي تلقاه في الأسفل واستمتع !
CSS3 Drop shadow generator
-----
4- Cascader
هذه الأداة, بالحقيقة, ليست مخصصة لـ CSS3 بشكل خاص، بل CSS بشكل عام، إذا كان لديك ملف HTML مضمن بداخله تعليمات CSS، وأنت تريد فصل الـ CSS عن الكود الأساسي، فهذه الأداة موجهة لفعل ذلك. أداة رائعة فعلاً.
Cascader
------
5- Border Radius.com
خاصية border-radius واحدة من أهم الخاصيات الجديدة في CSS3، هذه الأداة تجعلك قادر على صنع المربعات بسرعة والحصول على كود الـ CSS3.
Border Radius.com
-----
6- Button Maker
أداة رائعة وسهلة تستخدم CSS3 لصنع أزرار من الممكن استخدامها حيثما تشاء، فقط قم باختيار الألوان وحدد مقدار انحناء الحواف, واحصل على الكود جاهز لاستخدامه في موقعك.
Button Maker
-------
7- CSS3 Generator
هذا الموقع لديه أغلب خواص CSS3، كما يظهر لك أن هذه الميزة تعمل على المتصفحات من الإصدار كذا وفوق مثلاً.
CSS3 Generator
------
8- Modernizr
هو سكربت يكشف إذا كان المتصفح يدعم CSS3، فإذا كان يدعم فإنه يطبق تعليمات CSS المحددة، وإلا فإنه سيطبق تعليمات CSS التي تحددها أنت إذا لم يكن المتصفح يدعم CSS3، أي ببساطة يشبه الشرط (إذا كان فافعل وإلا).
Modernizr
------
9- HTML 5 & CSS3 Support
هل تريد أن تعرف هل إنترنت إكسبلورر يدعم خاصية text-shadow مثلا؟ فقط ألق نظرة على هذا الموقع الذي يحدد المتصفحات والخواص التي تدعمها.
HTML5 & CSS3 Support
------
10- ورقة غش CSS3
عندما تقوم بكتابة الأكواد, فورقات الغش تكون مفيدة جداً كي تتذكر بعض الخصائص وبناء الجمل, قامت مجلة Smashing بإصدار هذه الورقة من الغش لـ CSS3، بإمكانك تحميلها وطباعتها، هنا(اضغط الزر اليمين ثم حفظ باسم) .
ليست هناك تعليقات:
إرسال تعليق