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

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

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

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

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

أرشيف المدونة الإلكترونية

نص عادي

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

السلايدشو

فنون

إتصل بنا

الإسم الكريم البريد الإلكتروني مهم الرسالة مهم

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *

المشاركات الشائعة

© 2014/2017 موقع وثيقتيجميع الحقوق محفوظة برمجة و تطوير : ذ.إقبـــال أوعيسى