سؤال

ولدي اثنين من عناصر div النمط الذي أنا باستخدام فئة ومعرف، وشعبة من أنفسهم emtpy منذ أنهم النائبة الوحيدة لخلفيتهم. مثال الدرجة:

<div id='ranImg1' class='ranImg'></div>

وبعد ذلك I أسلوب لهم باستخدام هذه المغلق:

.ranImg {
  position:fixed;
  z-index:0;
  width:250px;
  height:250px;
  display:block;
}
#ranImg1 {
  left:10px;
  top:200px;
  background-attachment:fixed;
  background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
  background-repeat:no-repeat;
}

وطالما أن شعبة في الجزء العلوي الأيسر من المستند تظهر صورة بشكل صحيح ولكن عندما يتم وضع الدرجة مكان آخر على الصفحة يبقى صورة (غير مرئية) في أعلى الزاوية اليسرى من الصفحة التي تظهر فقط الجزء الذي يتداخل مع شعبة (في المثال هذا من شأنه أن يكون الجزء السفلي من الصورة).

تعديل أحاول وضع هذه عناصر div دون إحداث تخطيط بلدي آخرين، هم وراء التخطيط الآخرين. هذا وتعمل باستثناء حقيقة أن صورة الخلفية لا يتبع موقف عناصر div.
وذلك أساسا سؤالي هو، لماذا لا الخلفية لتحديد المواقع ranImg1 شعبة مع شعبة ولكن يبقى في الزاوية العليا اليسرى، وكيفية إصلاح هذا؟

هل كانت مفيدة؟

المحلول

وbackground-attachment:fixed الخاص بك سوف نعلق صورة الخلفية بالنسبة لنافذة المتصفح. إذا كنت تريد ذلك "لمتابعة" الموقف div، فقط إزالة السطر:

#ranImg1{
  left:10px;
  top:200px;
  background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
  background-repeat:no-repeat;
}

ويمكنك أيضا تعيين السمة background-position لوضع الخلفية المتعلقة div الذي يحتوي على:

background-position: 0px 0px;

ولست متأكدا إذا كان ذلك من شأنه أن يساعد أي أبعد من مجرد إزالة background-attachment على الرغم من (لا القهوة كافية حتى الآن!)

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top