اخر مواضيع عبدالصمد

عبدالصمد المازغي

شخص متواضع، مؤسس مدونة نجمة، مصمم مواقع و لديه نظرة عامة على أغلب لغات البرمجة، أقول لك مرحبا بك في نجمة صديقي

طريقة عمل تدرج للـborder بـCSS3

السلام عليكم أحبابي في الله، بعد تعلمك أساسيات لغة الـCSS التي سبق و شرحناها على قناة نجمة (من هنا)، يجب عليك أن تبحث أكثر و تتعلم كل جديد هذه اللغة،  مع جميع الميزات الجديدة التي أتت بها الـCSS3، نحن الآن قادرون على بناء المواقع بصور أقل، يعني لعمل تدج ألوان لاحاجة لنا بعمله بالفوتوشوب و رفع الصورة على الموقع، سنقوم بعمله مباشرة باستعمال الـCSS3. اليوم، أصبحت لغة CSS3 أكثر احترافية و تمكنك من عمل أشياء خيالية، تدرجات، انميشن...
في هذا الدرس سنتعرف معا كيف نقوم بعمل تدرج للحدود أو لجوانب العناصر في صفحة HTML مثلا (border) مع العديد من الطرق و التي يمكنك تطبيقها على أي عنصر كان.
1 - أولا، تدرج الألوال من أعلى إلى أسفل العنصر :

2 -  تدرج الألوال من يسار إلى يمين العنصر :

3 -  تدرج الألوال مائل (Diagonal ) :

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

ليست هناك تعليقات:

إرسال تعليق

تخفيضات

قناة نجمة الرسمية

صفحة نجمة الرسمية

الأكثر تصفحا

جميع الدورات

{"type":"footer-slider","label":"جميع الدورات","posts_number":"12"}

نجمة :

أحيانًا، عليكَ أن تلقِ نظرة على ماضيك، وتبتسم برضا على ما وصلت إليه