Как я могу использовать два фоновых изображения на одной странице - PullRequest
2 голосов
/ 06 мая 2010

У меня есть одна проблема,

У меня есть одно фоновое изображение высотой 1000 пикселей. который я использовал в теле css с фиксированной высотой, но на некоторых страницах высота моего содержимого увеличивается больше, чем фоновое изображение, это выглядит не очень хорошо, поэтому я поискал в Google и нашел способ решить эту проблему, а затем использовал тег body

<body style="height:830px"> 

, а затем я использовал кусок bg-less of width = "960px", который я использовал в теге html

<html style="background:url(/images/bg-below.png) top center repeat-y #4290B7;">

работает нормально во всех браузерах, кроме Internet Explorer. Пожалуйста, скажите, что мне делать, как я могу решить эту проблему.

Спасибо Mayur

Ответы [ 2 ]

1 голос
/ 06 мая 2010

В качестве первого элемента в <BODY> укажите: <div style="background-image:url('yourimage.jpg');position:fixed;z-index:-1;width:100%;height:100%;margin:0"></div>

Фон div будет накладываться поверх стандартного фона.

Примечание: IE6 требует специальногоОбходной путь , поскольку он не поддерживает фиксированное позиционирование.

0 голосов
/ 17 марта 2011

Я нашел способ отображения двух фоновых изображений для одного div в IE:

  1. Создание условной таблицы стилей для IE и в этой таблице стилей, добавление CSS для нового div. Чтобы создать условную таблицу стилей, просто создайте новую таблицу стилей с именем iestyle.css или как вы хотите, чтобы она называлась, загрузите ее на свой сервер и затем укажите в заголовке веб-страницы следующую строку кода:

enter image description here

  1. В моем html я добавляю новый div в существующий div (который имеет два фона).

  2. В моей таблице стилей IE я переписываю CSS для исходного элемента div, чтобы он отображал только один фон, и я задаю стиль для второго элемента div, чтобы отобразить второй фон. Я стилизовал их так, чтобы при просмотре в IE сайт выглядел одинаково, как и в других браузерах, хотя в IE он будет использовать два элемента div.

Таким образом, если веб-сайт просматривается в IE, один фон отображается в исходном div, а один фон - в новом div. Если сайт просматривается в Mozilla, Chrome и т. Д., Тогда исходный div просто использует стили в исходной таблице стилей, которая настроена для отображения двух фоновых изображений, и по существу игнорирует второй div, поскольку стилей нет. для этого в обычной таблице стилей.

В любом случае, вы можете увидеть полное описание кодов на одном из моих постов в блоге, если вам нужна дополнительная информация - http://blog.thelibzter.com/using-two-background-images-for-one-div-in-ie

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...