Фон тела не работает в FireFox

Question

Я использовал следующий код для фонового изображения тега body.

background-image: url(images/taling.gif);
background-repeat:repeat-x;
background-color: #2E2E2E;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;

это работает в IE, Opera и Chrome, но не работает в FireFox. Я пробовал также:

background-image: url("images/taling.gif");

и

background-image: url ('images / taling.gif');

но он не работает в FireFox

Answer 1

ваше тело документа имеет высоту = 0 и ширину = 0, если вы попытаетесь задать ему некоторую высоту или ширину, изображение должно отображаться

Answer 2

Нет проблем с вашим CSS. Проблема, скорее всего, является результатом того, что вы либо не назначаете ширину и высоту тегу body, либо неправильно называете свое изображение, используете неверное расширение для вашего изображения, либо неверный путь к изображению, но Также возможно, что вам нужно добавить ширину и высоту.

Если вы используете Firefox, вы можете проверить, что происходит, с помощью Firebug. Вы щелкаете правой кнопкой мыши и выбираете осмотреть элемент. После этого в правой колонке Firebug вы можете увидеть объявление для background-image. Если в нем указано, что изображение не загружено или не может быть найдено, проблема заключается в одной из трех указанных выше вещей.

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

Просто к вашему сведению, вы можете сжать свой CSS, выполнив следующие действия:

background-image: url(images/taling.gif);
background-repeat:repeat-x;
background-color: #2E2E2E;

до

background: #2e2e2e url(images/taling.gif) repeat-x;

Что касается тега body, вы можете добавить следующие свойства и значения:

margin: 0;
padding: 0;
width: 100%;
height: 100%;

Google "сброс браузера CSS"

Один из примеров сброса в браузере:

html, body {
width: 100%;
height: 100%;
}
body {
margin: 0;
padding: 0;
}

Выше приведен самый простой сброс браузера. Не учитывается ul,ol,li,h1,h2,h3,h4,h5,h6,li,p,a,img,blockquote и т. Д.

Кроме того, посмотрите на использование clearfix.

Я мог бы рассказать о том, почему у вас может быть эта проблема.

Надеюсь, это поможет.

Answer 3

Попробуйте:

background: url('yourimage.ext') repeat-x;

Это работает для меня.

Редактировать : чтобы соответствовать тому, что вы делаете, это на самом деле должно быть :

background: #2E2E2E url('images/taling.gif') repeat-x;