1. إستبعاد الملاحظة
  2. الإدارة العامة

    صفحة منتديات زيزووم للأمن والحماية

  3. الإدارة العامة

    الصفحة الرسمية لمنتديات زيزووم للأمن والحماية الفيس بوك

  4. الإدارة العامة

    الصفحة الرسمية لمنتديات زيزووم للأمن والحماية التلكرام

درس دورة تعلم لغة CSS | الحدود (12)

الموضوع في 'منتدى الدّورات العامّة ولُغات البرمجة' بواسطة Ibrahem Smart, بتاريخ ‏أغسطس 14, 2018.

  1. Ibrahem Smart

    Ibrahem Smart زيزوومى ذهبى

    إنضم إلينا في:
    ‏يناير 30, 2017
    المشاركات:
    1,832
    الإعجابات :
    1,077
    نقاط الجائزة:
    1,050
    الجنس:
    ذكر
    الإقامة:
    الاسكندرية
    برامج الحماية:
    ESET
    نظام التشغيل:
    Windows 7


    [​IMG]

    مرحبا إخوتي أعضاء منتديات زيزووم للأمن والحماية
    اليوم سأشرح لكم في دورة تعلم لغة
    CSS

    Borders
    حواف العنصر

    ------------------------------------------------------------

    نحن نعلم ان كل عنصر سواء (نص & صندوق & صورة...إلخ) له حدوده فسنتعلم اليوم خاصية لعمل اطار للعنصر بالحجم واللون الذي تختاره وفي المكن الذي تريد.

    خاصية
    border تكتب مثل أي خاصية ونراها عادة بشكل مشابه للتالي مثلًا:

    1.png

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

    2.png

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

    3.png

    شرح مفصل لكتابة خاصية الاطار (Border)

    نكتب أولًا عند بداية اي خاصية بأسمها
    border ثم نضع نقطتين : ونبدأ بالكتابة على سطر واحد.

    أول القيم للاطار هو
    حجمه (ضخومته) يجب أن تحدد له حجمًا يظهر به كما تريد.

    وثاني قيمة والتي تحتاج فهم جيد وهي
    نوع الاطار (شكله) فيوجد اطار كامل وعلى شكل نقط وعلى شكل شرطات وأنواع أخرى كثيرة.

    وهذه كل أنواع الاطارات ومعناها في صورة يمكنك حفظها لديك للنظر فيها في أي وقت:

    4.png

    القيمة الأخيرة وهي
    (اللون) يمكنك كتابته أو لا فإن لم تكتبه يأخذ الإطار بنفسه اللون الأسود وإذا حددت اللون في قيم الإطار فسيظهر اللون الذي قمت باختياره وقد شرحنا سابقًا في الدورة الألوان وكيف تكتب.

    ملحوظة بسيطة: بين كل قيمة والأخرى يجب أن تقوم بوضع مسافة واحدة.

    هكذا تعلمنا كيف نكتب الخاصية ونكتب قيمها.

    توجد أيضًا
    4 خواص أخرى تابعة لخاصية border ويأخذون نفس قيمها لكن تقوم بتحديد مكان واحد يظهر فيه الأطار:

    border-top: اطار في الأعلى.

    border-bottom: اطار في الأسفل.

    border-left: اطار في اليسار.

    border-right: اطار في اليمين.

    خلاصة الدرس

    • لعمل إطار للعنصر يجب استخدام خاصية border.
    • قيم خاصية border ثلاثة بالترتيب (الحجم ثم النوع ثم اللون).
    • يوجد عدة أنواع (أشكال) للإطار ويوجد في الأعلى صورة توضحهم.
    • بين كل قيمة والأخرى للأطار مسافة واحدة حتى لا تواجه أي مشاكل في قراءة المتصفح للأكواد.
    • يوجد للإطار أربع إتجاهات.
    واتأسف لكم اخوتي إن كان معدل النشر سيئًا بسبب ظروف العمل وأيضًا توجد مؤخرًا لدي بعض المشاكل في الانترنت.
    [​IMG]
     
  2. اليوناني

    اليوناني مصمم زيزوومي مميز ★ نجم المنتدى ★ نجم الشهر فريق التصميم فريق دعم البرامج العامة

    إنضم إلينا في:
    ‏نوفمبر 13, 2014
    المشاركات:
    18,087
    الإعجابات :
    29,227
    نقاط الجائزة:
    12,534
    الجنس:
    ذكر
    برامج الحماية:
    Kaspersky
    نظام التشغيل:
    Windows 10
    جميل جدا و لكن عندي سؤال
    لو بالامكان تخبرنا ما هي الازار الرئيسية بالكيبورد
    لكتابة الشرطة و الفاصلة المنقوطة و الاقواس و ....غيرها
    و شكرا
     
    أعجب بهذه المشاركة Ibrahem Smart
  3. Ibrahem Smart

    Ibrahem Smart زيزوومى ذهبى

    إنضم إلينا في:
    ‏يناير 30, 2017
    المشاركات:
    1,832
    الإعجابات :
    1,077
    نقاط الجائزة:
    1,050
    الجنس:
    ذكر
    الإقامة:
    الاسكندرية
    برامج الحماية:
    ESET
    نظام التشغيل:
    Windows 7
    هذه الاختصارات على كيبورد اللابتوب لا أعرف هل ستتغير في الكيبورد العادي أم لا

    الشرطة: يوجد لها زر في صف الأرقام العريض إذا ضغطت عليه يكتب لك شرطة في المنتصف - وإذا ضغطت عليه مع shift تظهر في الأسفل _

    النقطتين: shift + حرف الكاف (ك) اذا كانت الكيبورد عربي او انجليزي.

    الفاصلة المنقوطة: تكتب بحرف الكاف فقط باللغة الانجليزية

    اقواس المجموعة للغة الانجليزية: { = shift + حرف (ج). } = shift + حرف (د).

    اقواس المجموعة للغة العربية: shift + (ؤ & ر).

    اقواس <> للغة الانجليزية: shift + (و & ز)
     
    أعجب بهذه المشاركة اليوناني
  4. m-m-s-s

    m-m-s-s زيزوومي VIP ★ نجم المنتدى ★

    إنضم إلينا في:
    ‏مارس 9, 2008
    المشاركات:
    5,423
    الإعجابات :
    3,486
    نقاط الجائزة:
    3,115
    الجنس:
    ذكر
    الإقامة:
    القاهرة
    برامج الحماية:
    ESET
    نظام التشغيل:
    Windows 10
    بارك الله فيك و سدد خطاك.png
     
  5. اليوناني

    اليوناني مصمم زيزوومي مميز ★ نجم المنتدى ★ نجم الشهر فريق التصميم فريق دعم البرامج العامة

    إنضم إلينا في:
    ‏نوفمبر 13, 2014
    المشاركات:
    18,087
    الإعجابات :
    29,227
    نقاط الجائزة:
    12,534
    الجنس:
    ذكر
    برامج الحماية:
    Kaspersky
    نظام التشغيل:
    Windows 10
    شكرا لك
     

مشاركة هذه الصفحة

جاري تحميل الصفحة...