رويـــــال فـــريـــنـــدس
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

رويـــــال فـــريـــنـــدس

اسلاميات | رياضه | اخبار | صور | اغانى | افلام | مسلسلات | فيديوهات | كورسات | تطوير المنتديات | وكل مايخص الموبيل
 
الرئيسيةالمجلهأحدث الصورالتسجيلدخول
الدرس 8: نموذج الصندوق 001uq910
الساده اعضاء رويـــــال فـــريـــنـــدس
نريد ان نعلمكم ان المنتدى يتوفر على رابطين
 https://royalfriends.own0.com
 http://assasi4ever.own0.com
وشكرااااااااااا
By Abu Ali Elassasy


 

 الدرس 8: نموذج الصندوق

اذهب الى الأسفل 
2 مشترك
كاتب الموضوعرسالة
AbU ALi ElA$Sa$Y
AbU Ali ElAsSaSy SiTe EmPeRoR
AbU Ali ElAsSaSy SiTe EmPeRoR
AbU ALi ElA$Sa$Y


النادى المفضل : الدرس 8: نموذج الصندوق Logo2425
الجنسيه : الدرس 8: نموذج الصندوق 3dflag10
مزاجك ايه : الدرس 8: نموذج الصندوق 1210
هوايتى : الدرس 8: نموذج الصندوق Chess10
المهنة : الدرس 8: نموذج الصندوق Progra10
الجنس : ذكر
عدد المساهمات : 3295
نقاط العضو : 47581
شعبية العضو : 1740
السمك
الديك
الموقع : عايش فى منتدى العساسيه
العمر : 31
تاريخ التسجيل : 22/05/2009
اوسمتى : الدرس 8: نموذج الصندوق Xxtt8
اوسمتى 2 : الدرس 8: نموذج الصندوق Wafaa
اوسمتى 3 : الدرس 8: نموذج الصندوق Ebda4e_39
دعائى يارب تقبله : الدرس 8: نموذج الصندوق Fp_21

بطاقة الشخصية
شات المنتدى:

الدرس 8: نموذج الصندوق Empty
مُساهمةموضوع: الدرس 8: نموذج الصندوق   الدرس 8: نموذج الصندوق I_icon_minitime10th يونيو 2010, 23:34

نموذج الصندوق في CSS يصف الصناديق التي تنشأ من خلال عناصر HTML،
نموذج الصندوق يحوي أيضاً خيارات مفصلة حول تعديل الحاشية، الإطار، الحشو
والمحتويات لكل عنصر، في المثال التوضيحي أدناه سنعرض أجزاء نموذج الصندوق:


نموذج الصندوق في CSS


الدرس 8: نموذج الصندوق Figure008

الرسم أعلاه يبدو مربكاً بعض الشيء، لذلك لنقم باستخدام نموذج
الصندوق في مثال فعلي باستخدام عنوان وبعض النصوص، في HTML وضعنا نصاً
مقتبساً من الميثاق العالمي لحقوق الإنسان:



Article 1:



All human beings are born free
and equal in dignity and rights.
They are endowed with reason and conscience
and should act towards one another in a
spirit of brotherhood







بإضافة بعض الألوان وتحديد بعض المعلومات حول الخطوط يمكن للمثال أن يصبح بهذا الشكل:

الدرس 8: نموذج الصندوق Figure009

المثال يحوي عنصرين

و

، نموذج الصندوق للعنصرين سيظهر بهذا الشكل:

الدرس 8: نموذج الصندوق Figure010

حتى لو بدى المثال معقداً، الرسم يوضح كل عنصر في HTML محاط بصناديق، الصناديق يمكن تعديلها من خلال CSS.

الخصائص التي تتحكم بالصناديق المختلفة هي: padding وmargin وborder، في الدرسين اللاحقين سنتعامل مع هذه الخصائص الثلاثة.


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

ترقبو المزيد من الدروووووووووس الدرس 8: نموذج الصندوق 600677

الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://royalfriends.own0.com
hassan_dmar
عضو ماهر
عضو ماهر
hassan_dmar


النادى المفضل : الدرس 8: نموذج الصندوق Logo1114
الجنسيه : الدرس 8: نموذج الصندوق Ps10
مزاجك ايه : الدرس 8: نموذج الصندوق 1210
هوايتى : الدرس 8: نموذج الصندوق Travel10
المهنة : الدرس 8: نموذج الصندوق Studen10
الجنس : ذكر
عدد المساهمات : 184
نقاط العضو : 10673
شعبية العضو : 4
الجدي
الكلب
الموقع : اول لفة على ايديك اليمين
العمر : 29
تاريخ التسجيل : 16/08/2010
اوسمتى : الدرس 8: نموذج الصندوق Empty
اوسمتى 2 : الدرس 8: نموذج الصندوق Empty
اوسمتى 3 : الدرس 8: نموذج الصندوق Empty
دعائى يارب تقبله : الدرس 8: نموذج الصندوق 553bd1df56

الدرس 8: نموذج الصندوق Empty
مُساهمةموضوع: رد: الدرس 8: نموذج الصندوق   الدرس 8: نموذج الصندوق I_icon_minitime17th أغسطس 2010, 00:02

الدرس 8: نموذج الصندوق 600677
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://rock-soul.ahlamontada.net
AbU ALi ElA$Sa$Y
AbU Ali ElAsSaSy SiTe EmPeRoR
AbU Ali ElAsSaSy SiTe EmPeRoR
AbU ALi ElA$Sa$Y


النادى المفضل : الدرس 8: نموذج الصندوق Logo2425
الجنسيه : الدرس 8: نموذج الصندوق 3dflag10
مزاجك ايه : الدرس 8: نموذج الصندوق 1210
هوايتى : الدرس 8: نموذج الصندوق Chess10
المهنة : الدرس 8: نموذج الصندوق Progra10
الجنس : ذكر
عدد المساهمات : 3295
نقاط العضو : 47581
شعبية العضو : 1740
السمك
الديك
الموقع : عايش فى منتدى العساسيه
العمر : 31
تاريخ التسجيل : 22/05/2009
اوسمتى : الدرس 8: نموذج الصندوق Xxtt8
اوسمتى 2 : الدرس 8: نموذج الصندوق Wafaa
اوسمتى 3 : الدرس 8: نموذج الصندوق Ebda4e_39
دعائى يارب تقبله : الدرس 8: نموذج الصندوق Fp_21

بطاقة الشخصية
شات المنتدى:

الدرس 8: نموذج الصندوق Empty
مُساهمةموضوع: رد: الدرس 8: نموذج الصندوق   الدرس 8: نموذج الصندوق I_icon_minitime17th أغسطس 2010, 11:11

شكرااااااااااا لمرورك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://royalfriends.own0.com
hassan_dmar
عضو ماهر
عضو ماهر
hassan_dmar


النادى المفضل : الدرس 8: نموذج الصندوق Logo1114
الجنسيه : الدرس 8: نموذج الصندوق Ps10
مزاجك ايه : الدرس 8: نموذج الصندوق 1210
هوايتى : الدرس 8: نموذج الصندوق Travel10
المهنة : الدرس 8: نموذج الصندوق Studen10
الجنس : ذكر
عدد المساهمات : 184
نقاط العضو : 10673
شعبية العضو : 4
الجدي
الكلب
الموقع : اول لفة على ايديك اليمين
العمر : 29
تاريخ التسجيل : 16/08/2010
اوسمتى : الدرس 8: نموذج الصندوق Empty
اوسمتى 2 : الدرس 8: نموذج الصندوق Empty
اوسمتى 3 : الدرس 8: نموذج الصندوق Empty
دعائى يارب تقبله : الدرس 8: نموذج الصندوق 553bd1df56

الدرس 8: نموذج الصندوق Empty
مُساهمةموضوع: رد: الدرس 8: نموذج الصندوق   الدرس 8: نموذج الصندوق I_icon_minitime17th أغسطس 2010, 21:14

:)
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://rock-soul.ahlamontada.net
 
الدرس 8: نموذج الصندوق
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» الدرس العاشر نموذج الصندوق - الإطارات
» كود css لوضع خلفية للأزرار كتابة رد و أزرار الصندوق المتطور و دخول
» الدرس السابع
» الدرس 3: الخطوط
» الدرس الاول

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
رويـــــال فـــريـــنـــدس :: ––––•(-• اكواد css •-)•––––-
انتقل الى: