[شرح] شرح طريقة اضافة class جديد

Aljawal 5555

عضو جديد
1 مارس 2009
44
0
0
www.alm6wer.com
السلام عليكم ورحمة الله وبركاته

سنتحدث اليوم عن الكلاس ' class '

ماهو الكلاس class؟
الكلاس هو مجموعة من الخصائص التي يتم الاستناد اليها في جميع انحاء المنتدى مثل :
1- الجداول
2- الاطارات
3- الحقول
وما شابه ذلك

صورة توضيحية لأحد هذة الخصائص الكلاس class :



نشاهد في الصورة العديد من الخانات مثل :
1- الخلفية
2- لون الخط
3- شكل الخط
4- حجم الخط
5- نوع الخط
6- زخرفة الخط
هذة هي الخانات الاساسية للكلاس class
عدا ذلك يمكن كتابة في الخانه اليسرى من الكلاس وهي :
خواص CSS الإضافية
ويمكن ايضا كتابة العديد من الخصائص الاخرى بهذة الخانه مثل :
1- الطول
2- العرض
3- حدود الجدول
والكثير من الاضافات الاخرى ...

سؤال مهم جدا ً
كيف يمكن اضافة كلاس class جديد يمكن الاستناد اليه لعدد من الجداول او الحقول بحيث لا يستند الى الكلاسات الاساسية ؟؟

توجد خانة اسفل CSS رئيسي كما في الصورة :



يمكن من خلال هذة الخانة انشاء كلاس class جديد يتم الاستناد اليه لحالات خاصة في احدى خانات المنتدى

مثال :

في قالب الموضوع توجد خانه لتاريخ الموضوع اعلى قالب البوست بت ليجاسي
نريد تغيير شكل الجدول بخصائص معينة وليكن كما في الصورة :



كما تشاهدون هناك لون للخليفة وحدود للجدول خاصة فقط لهذا الجدول بالتحديد وليس لجميع جدوال المنتدى

فكيف يتم ذلك ؟؟

اولا : نقوم بانشاء كلاس جديد بأسم ( hs1 ) ونضيفه اليه خواص CSS الإضافية أسفل CSS رئيسي
ونكتب الكود التالي :

PHP:
.hs1 {
background: #D6EFF4;
border: 1px solid #B1DEE6;
font: 11px Tahoma;
color: #000000;
}

شرح الكود :
اضفنا متغير بأسم ( hs1 )
ثم اسندنا له الخصائص في سطر جديد
background = لون الخلفية
border = حدود الجدول
font = حجم ونوع الخط
color = لون الخط

ثانيا : نقوم بنسخ قالب البوست بت ليجاسي في الفرنت بيج ليتم التعديل عليه ( التعديل فقط على اسم المتغير أو بما يعرف بالكلاس )
نقوم بحذف متغيير الكلاس وهو ( thead ) ونضيف المتغير الجديد ( hs1 ) ليصبح هكذا :

PHP:
<td class="hs1"

:cool:

=============================

عرفنا في بداية الشرح ما هو الكلاس وكيف يمكن لنا انشاء كلاس جديد :dude:

الان سأضع بعض الامثله المهمة والاسئلة الشائعه ..

س1: هل يمكن الاستناد الى متغيرين ( أي عدد 2 كلاس ) وكيف يتم ذلك ؟؟
ج1 : نعم يمكن الاستناد الى متغيرين
ويتم بالصورة التالية :
PHP:
<td class="hs1" AND "hs2"
قد يتسأل شخص لماذا نستند الى متغيرين مع العلم بأننا نستطيع ان نضيف الخصائص الاخرى في نفس الكلاس أو المتغير الاول ؟ :high:
الجواب : قد تضطر لعمل كلاس جديد يتم الاستناد له في جميع الجداول ولكن تريد لأحد هذي الجداول خاصية معينة دون باقي الجداول ، لذلك يتم الاستناد الى متغيرين في جدول واحد أو حقل معين .

س2 : ماهي أهم الخصائص للكلاس وكيف يتم كتابة الكود الخاص بها ؟
ج2 : تنقسم الخصائص لعدة اقسام مثل :

لون الخلفية :
PHP:
background: #FF0000;

صورة للخلفية
PHP:
background-image:url('رابط الصورة');

لون الخط
PHP:
color: #000000;

شكل الخط
PHP:
font: bold 11px Tahoma;

حدود الجدول في جميع الخانات
PHP:
border: 1px solid #FF0000;

حدود الجدول الخانه العليا فقط
PHP:
border-top: 1px solid #FF0000;

حدود الجدول الخانه السفلى فقط
PHP:
border-bottom: 1px solid #FF0000;

حدود الجدول الخانه اليمنى فقط
PHP:
border-right: 1px solid #FF0000;

حدود الجدول الخانه اليسرى فقط
PHP:
border-left: 1px solid #FF0000;

حدود الجدول للخانه اليمنى واليسرى فقط
PHP:
border-left: 1px solid #FF0000;
border-right: 1px solid #FF0000;

هذة بعض خصائص الكلاس الاساسية التي يمكن اضافتها في كلاس جديد ، حيث يوجد العديد من الخصائص الاخرى الكثيرة التي سنتعلمها في الدروس الاخرى باذن الله تعالى ..


ارجو ان اكون وفقت في هذا الشرح ، فأن اصبت فمن الله ، وان اخطأت فمن نفسي والشياطين

جميع الحقوق محفوظه لكل مسلم ، ولكن يرجى عند نقل الموضوع ذكر المصدر :eyepopping: ..