نفتح تعليق خلفية الصورة

بهذا الـ style

نفس الامر تماما ينطبق على الـpadding

لاحظ كيف ان العناصر لاصقه على الحدود هذا يعني اننا بحاجة الى عمل مسافة داخليه وهذا ما يسمى padding

لا احتاج مسافة لاعلى واسفل فثبتها ب 0 واضفت 20 بكسل للجانبين

جهزنا الخلفية والفورم
تالياً نحتاج لتنسيق محتويات الفورم وهي:
h1
input
button
p
a

وتذكر نحن الان داخل الفورم اخذنا 350 بكسل العرض ✨

نبدأ بتنسيق النصوص الموجودة داخل الـ Login (تنسيق النصوص Text)

وكل هذه المواضيع تخص النص

نحتاج في هذه المثال لمعرفة اثنين فقط
color
alignment

الاول لون النص (ولا اسهل)
h1{
color: #000000
}

الثاني اتجاه النص:
وهناك الخيارات التالية:

في مثالنا نحتاج لتوسيطها داخل الفورم بالتالي سنستخدم center

✨ملاحظة:
كل عنصر قد يكون اب (parent) وقد يكون ابن (child)
مثلا الـform ابن الـ body
والـh1 ابن form
لذا فعندما اوسط الـform فإنه سيكون وسط بالنسبة للاب body
وعندما اوسط الـعنوان فانها ستوسط بالنسبة للـform