1

مساعدة في توسيط الصور بأستخدام css

السلام عليكم ورحمة الله وبركاته

كيف حالكم مجتمع حسوب ؟

ما هي الطريقة لتوسيط الصورة بأستخدام css

علمأ أنني بحثت ولم أجد الطرية المناسبة

أرجو المساعدة

يرجى الدخول لحسابك أو تسجيل حساب لتستطيع إضافة تعليق
حساب جديد دخول

التعليقات

1
3ABDOO أضف ردا

وضح أكثر ، أو بالأحرى هل تريد أن تضهر الصورة في وسط الصفحة ؟

0
abdullhksa أضف ردا

نعم بأستخدام css

1
3ABDOO أضف ردا 
background-position: center;

في حالة إذا كانت خلفية .

ولكي تعرف المزيد :

0
abdullhksa أضف ردا

هي صورة وليست خلفية

على سبيل المثال وضعت

<img src='kkcmg.jpg' width='400'/

 واريد ان اضعها في الوسط بأستخدام css

1
مجهول
  • حذف بواسطة المستخدم
0
abdullhksa أضف ردا

أحسنت ولكن هل يمكن أستخدام كلمة center

لأن 40% ليست في الوسط تماما

وايضا اتسعت لدي الشاشة وظهر لي شريط للتحريك يمين ويسار

1
3ABDOO أضف ردا

عوض 40% أكتب auto

1
مجهول
  • حذف بواسطة المستخدم
0
مجهول
  • حذف بواسطة المستخدم
1
abdullhksa أضف ردا

أشكركم كثيرأ

حللتها بأستخدام

margin: 0 38%;

margin-right:0;

توسطت الصورة ولم يعد يظهر عندي شريط التحريك

1
ahmad.khteeb أضف ردا

جرب عمل 

text-align:center;

للعنصر الأب parent واعمل 

display:inline-block;

لوسم ال img

0
abdullhksa أضف ردا

أحسنت توسطت بشكل جيد

0
ahmad.khteeb أضف ردا

بالتوفيق :)

1
mohamed youssouf أضف ردا

هذا لعناصر block level

IMG {
width: 400px;
height: auto;
margin: 0px auto;
}

أما بعناصر inline level

.parent-container {
text-align: center;
}
0
abdullhksa أضف ردا

انا وضعت فوق الصورة h1

وبعدها الصورة

وبعدها div

اريد تحريك الصورة لليمين

ولكن لم تنفع طريقة

margin: 0px auto;

2
mohamed youssouf أضف ردا

تريد توسيطها أم محاذاتها ليمين؟

لمحاذة أي شيء أستخدم float هكذا:

IMG {
float: right;
}
1
يوسف سيد أضف ردا

تحدثت عن الأمر من قبل بحسابي القديم:

0
abdullhksa أضف ردا

نفعت معي طريقة

margin: auto;

display: block

1
مستقلل أضف ردا

لتوسيط اي صورة استعمل هذه

display: block;
margin-left: auto;
margin-right: auto;
0
MohamedAladdin أضف ردا

لماذا لا تستخدم Center> في html ؟

0
abdullhksa أضف ردا

زيادة في الخبرة

و <center تعمل بالشكل الصحيح ولكن انا كنت اريد الزيادة في الخبرة

0
javascript أضف ردا

هذا دليل كامل :

0
YounesSan أضف ردا 
 margin-right:auto;
 margin-left:auto;
 display:block;