سؤال : كيف أخفي جزء من صورة خلف div

[مهندس مصرى]

السلام عليكم ورحمة الله وبركاته
أريد أن أستفسر عن كيفية اخفاء جزء من الصورة خلف ال div اذا زاد عن طول معين او عرض معين؟؟
انا رايتها في مواقع كثيرة لكن لم اعرف كيف اطبقها بال css
وهل يمكن التحكم من اين يتم اخفاءها بالضبط (يسار,يمين,أعلى,أسفل) ؟؟
لنفرض ان لدي صورة 375 * 400 بكسل
ولدي div بأبعاد 300*350 بكسل واريد عرض الصورة دون عمل resize لها بإخفاء الجزء الزائد خلف ال div نفسه واذا كان هناك امكانية التحكم في مكان القطع اعلى او اسفل او يسار او يمين او بابعاء معينة .. اتمنى ان تكون الفكرة واضحة .. وجزاكم الله خيرا مقدماً

[[Dynamic]]

لا اعرف طريقة بشكل عام... لكن ممكن تكون أحد الافكار استخدام الصورة كخلفية مثلا ل div بابعاد 300*350

[ليوناردو دافينشي]

هناك اكثر من طريقة واذكر منها استخدام الصورة كخلفية كما قال الاخ DYNMAIC

 
background-image: url("image.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: right bottom; 

background-position هي التي تتحكم بمكان القطع
وضعتها انا right bottom اي ان القطع سوف يكون من الاعلى شمالاً

لنفرض ان لدي صورة 375 * 400 بكسل
ولدي div بأبعاد 300*350 بكسل واريد عرض الصورة

مثال اخر

اذا كنت تريد قطعها من الجانب الايمن فقط

 
background-image: url("image.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: left ; 

حجم الـdiv عمودياً يطابق حجم الصورة عمودياً
حجم الـdiv افقياً يساوي حجم الصورة بعد القطع
اي تطرح المساحة التي تريد قطعها من الجانب الايمن من حجم الصورة افقياً

اتمنى ان اكون افدتك

[Fez-Soft]

ممكن طبعا و الطريقة ذكرها الأخ ليوناردو ..

فقط كقاعدة -> الجوانب التي لا تريدها ان تقطع ( يعني تريدها ان تبقى تظهر ) هي التي تموضعها بالأبعاد left right bottom top center
في آخر الكود الذي ذكر الأخ ..

بالتوفيق

[سحاب اون لاين]

يمكنك استخدام طريقة الأخ ليوناردو هذا اذا كانت الصورة خلفية
أم اذا كانت الصورة تستخدم بطريقة تاج الـ img
فعليك استخدام خانة overflow لـ div الحاوي للصورة نفسها
بهذا الشكل

<div style="height:200px; width:200px; overflow:hidden;">
<img height="655" width="1024" src="big.jpg" />
</div> 

[سحاب اون لاين]

اما لاظهار الجزء الايمن للصورة
فعليك استخدام خاصية direction لـ div
بهذا الشكل

<div style="height:200px; width:200px; overflow:hidden; direction:rtl;">
<img height="655" width="1024" src="big.jpg" />
</div> 

اما للجزء الايسر

<div style="height:200px; width:200px; overflow:hidden; direction:ltr;">
<img height="655" width="1024" src="big.jpg" />
</div> 

[مهندس مصرى]

جزاكم الله خيرا اخواني على مساعدتكم

جزاك الله خيرا .. [Dynamic]
جزاك الله خيرا .. ليوناردو دافينشي
جزاك الله خيرا .. Fez-Soft
جزاك الله خيرا .. سحاب اون لاين

وتقبلوا خالص تقديري وشكري ..