Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. HTML & CSS

درس صغير: لا تستخدم بادئات الـ css مره اخرى (Vendor Prefix)

by
Difficulty:IntermediateLength:ShortLanguages:

Arabic (العربية/عربي) translation by Ali Atwa (you can also view the original English article)

ان تعرف ما عليك فعله هو امر رائع. تريد أن تعطي قسم ما في الموقع بعض الزوايا باستخدام الـ CSS3؟ اذا ستحتاج الى احد البادئات الثلاثة : webkit, moz ،W3C. أليس هذا هدر للوقت -- ناهيك عن مساحة الشاشة؟ ماذا لو بدلاً من ذلك استخدمنا ملف كلاس؟ حسنا، يمكننا! سوف تتعرف على هذا اليوم.


الحل

إذا كنت تستخدم أدوات مثل LESS او SASS، فيمكنك إنشاء كلاسات بسهولة تامة. ليس لديك أي فكرة عما أتحدث عنه؟ حسنا، أولاً، اقرا هذا الدرس البسيط،. سوف على كيفية استخدام اداة Less.


ملف الكلاسات

بعد ذلك، نحن بحاجة إلى إنشاء ملف كلاس سوف نستخدمه في كل مشروع. احفظ هذا الملف في أي مكان ترغب به، على الرغم من ذلك، في شريط الفيديو المذكور أعلاه، أنا استخدم التطبيق المشهور Structurer .

سوف نقوم بعمل الاولى معا، لكن شاهد اولا الدرس المصور لمزيد من التفاصيل.

فيما يتعلق بإصطلاحات التسمية، لقد وجدت أنه من الاصح استخدام الاسماء الموصى بها رسميا كاسم للكلاس --في هذه الحالة، "border-radius" لتعريف متغيرات باستخدام اداة ،Less نستخدم الرمز @ في البداية. وفي هذه الحالة، نحن نعين قيمة افتراضية 3px، على الرغم من ذلك، ينبغي أن نتغاضى عن هذه القيمة في مشروعنا، هذا سهل جدا!


بعض الامثلة

عند هذه النقطة، قم بتكرار هذا لكل خاصية تتطلب البادئات المتعددة (Vendor Prefix). هذه بعض الامثلة المتعدده:

ظل المربع

Transition

المربع

Flex


الخلاصة

اود ان اعرف رايك بالدرس. اذا اعجبتك الفكره فقم بتنفيذها في المشروع القادم

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.