Like And Win VIP Hack
Click Like To WIN 30 Day VIP Hack

[ دورة CSS ] الصندوق النموذجي CSS – الدرس الخامس – الهوامش الداخلية Padding

Home // Blog // [ دورة CSS ] الصندوق النموذجي CSS – الدرس الخامس – الهوامش الداخلية Padding

Share Now And Win Free ViP HackShare on Facebook0Google+0Tweet about this on Twitter0
 

تحدد خاصية الهوامش الداخلية المسافة حول العنصر

تعمل الهوامش الداخلية على تحديد المسافة حول العنصر (داخل الحدود) . تتأثر الهوامش الداخلية بلون خلفية العنصر

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

القيم الممكنة

القيمة الوصف
length يمكن تخصيص الهوامش الداخلية من خلال وحدات القياس px و pt و cm الخ ولكن القيمة الافتراضية للهوامش هي 0px
% % تخصص عرض الهوامش الداخلية للعنصر من خلال النسبة المئوية %

استخدام الهوامش بشكل مستقل

يمكن التعدديل على كل جانب من جوانب الهوامش الداخلية على حدة

مثال

padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;

خاصية اختصار الهوامش الداخلية

من الممكن اختصار وجمع جميع قيم الهوامش الداخلية في خاصية واحدة هي padding

مثال

padding:100px 50px;

يمكن التحديد على خاصية الهوامش الخارجية من 1 الى 4 قيم مختلفة

  • padding:25px 50px 75px 100px;
  1. الهوامش الداخلية العليا هي 25px
  2. الهوامش الداخلية اليمنى هي 50px
  3. الهوامش الداخلية السفلى هي 75px
  4. الهوامش الداخلية اليسرى هي 100px
  • padding:25px 50px 75px;
  1. الهوامش الداخلية العليا هي 25px
  2. الهوامش الداخلية اليمنى و اليسرى هي 50px
  3. الهوامش الداخلية السفلى هي 75px
  • padding:25px 50px;
  1. الهوامش الداخلية العليا و السفلى هي 25px
  2. الهوامش الداخلية اليمنى و اليسرى هي 50px
  • padding:25px
  1. جميع الهوامش الداخلية للاتجاهات الأربعة هي 25px
جميع خصائص الهوامش الداخلية padding

الخاصية الشرح
padding خاصية مختصرة قصيرة حيث يمكن تحديد جميع قيم الهوامش الداخلية في خاصية واحدة
padding-bottom ضبط الهوامش الداخلية السفلية للعنصر
padding-left ضبط الهوامش الداخلية اليسارية للعنصر
padding-right ضبط الهوامش الداخلية اليمينية للعنصر
padding-top ضبط الهوامش الداخلية العلوية للعنصر
Share Now And Win Free ViP HackShare on Facebook0Google+0Tweet about this on Twitter0

0 Comments ON " [ دورة CSS ] الصندوق النموذجي CSS – الدرس ال... "
leave a response

*

Copyright © All Rights Reserved 2014→2017 To Add-Fast.CoM