انتقل إلى محتوى الدرس

CSS padding left هامش داخلي يسار العنصر في لغة CSS

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

1 صفوف تعليمية
لغة CSS
4,524 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تًستخدم خاصية padding-left لعمل هامش داخلي أيسر العنصر في لغة CSS وقيمة الهامش الداخلي اليسار في الوضع الأفتراضي هي صفر أي انه بدون هامش.


قيم خاصية padding-left في لغة CSS:

  • length تحديد الهامش الداخلي اليسار بالوحدات ثابتة px,pt,cm.
  • percentage يتم تحديد الهامش الداخلي اليسار بناء علي حجم عرض محتوي العنصر %.

padding-left syntax

طريقة كتابة خاصية padding-top في لغة CSS.

HTML
padding-left:value;

padding-left values

قيم خاصية padding-left في لغة CSS.

HTML
padding-left:length|percentage|initial|inherit;

CSS no padding

عرض العنصر بدون هوامش داخلية CSS.

HTML
p
{
  border: 1px dotted black;
  background-color: yellow;
}

CSS padding left auto

ضبط مساحة padding left بالنسبة تلقائي بقيمة auto في لغة CSS.

HTML
p
{
  border: 1px dotted black;
  padding-left: auto;
  background-color: yellow;
}

CSS padding left

المسافة بين اليسار وبين النص p هي مسافة padding left وهي 100 px.

HTML
p
{
  border: 1px dotted black;
  padding-left: 100px;
  background-color: yellow;
}

CSS padding left percentage

ضبط مساحة padding left بالنسبة المئوية في لغة CSS.

HTML
p
{
  border: 1px dotted black;
  padding-left: 10%;
  background-color: yellow;
}