جار التحديث ...
جار التحديث ...

كيف تحدد مكان الصور عندما تريد عرضها في صفحتك html

  • 0

كيف تحدد مكان الصور عندما تريد عرضعها في صفحتك html

إجابات المستخدمين (4)


تحريك الصور يتم عبر css صديقي , يمكنك تحريكها باستخدام الهامش margin بعد تحويلها لعنصر block

او عبر استخدام طريقة position:absolute

مثال :

img{ 
    display:block: /*Make it a block level elemnet*/
    margin-right: 10px /*Will move the img 10px to the left*/
}

/*Other Way*/
.img-container{
  position:realtive;
}
.img-container img{
 position:absolute;
 top: 10px;
 bottom: 25px; 
}

  • 2
رد على التعليق (0)

الردود :


لا يوجد ردود بعد


سجل الدخول لاضافة رد

حسب وجودها ضمن الكود , كمثال اريد وضع عنوان قبل الصورة فيكون الكود كالتالي :

<h1>My Heading Here</h1>
<img src="IMAGE_SRC" >



الصورة هي عنصر من نوع inline اي انه سيموضع نفسه ضمن المساحة المتوفرة بصورة سطر واحد , فبالتالي لو اضفت نص وكان يوجد مساحة كافية سيظهر النص بجانب الصورة.

لكن كنتيجة عامة , ترتيب الاكواد هو ما يأكد مكان الصورة :)


  • 0
رد على التعليق (2)

الردود :


أقصد كيف أحرك الصور اذا أردت ان أغير مكانها مثلا احركها قليلا الى اليمين او اليسار

يتم ذلك باستخدام الهوامش الخارجية margin ويجب تغيير طريقة عرضها لتصبح display: inline-block فإذا اردت إزاحتها لليمين تستخدم margin-left لتدفعها من جهة اليسار لليمين


سجل الدخول لاضافة رد
سجل الدخول لاضافة اجابة جديدة