Фоновое изображение не отображается на странице при отображении в инструменте разработчика

Я использовал фоновое изображение в таблице стилей, но не отображалось на странице, пока показывал мне инструмент разработчика или копировал предыдущий URL-адрес в URL-адрес своей работы. вот код

.page-footer {
    background: url(https://priyachaudhary.com/pub/media/footer/footer-priya);
    position: relative;
    /* background: #f8f8f8; */
    padding: 40px 0;
    margin-top: 60px;

У вас белый фон?

Sujit Agarwal 10.08.2018 15:03

нет ничего не показывается

Abu 10.08.2018 15:05
} также отсутствует
Gilles-Antoine Nys 10.08.2018 15:08

на каком элементе находится этот класс, div? если это встроенный элемент, он ничего не будет отображать, потому что ширина будет равна 0. Вы должны указать ширину .page-footer, если он не является элементом уровня блока (например, span). Если вы покажете нам и свой html (только соответствующую часть), мы поможем вам лучше

duxfox-- 10.08.2018 15:10
0
4
35
2

Ответы 2

footer{
  background: url(https://priyachaudhary.com/pub/media/footer/footer-priya);
  width: 100%;
  height: 1205px;

  position: relative;
  /* background: #f8f8f8; */
  padding: 40px 0;
  margin-top: 60px;
}
<footer>
 fooot
</footer>

Исходное изображение имеет длинное белое пространство.

и вы должны ввести width и height

Ваш код работает нормально. Образ - 1559px x 1205px, а элемент - просто 100% x 98px. Итак, вы видите верхнюю часть, которая белая.

Поэтому вам нужно либо настроить это изображение с помощью редактора фотографий, либо увеличить высоту элемента:

.page-footer {
    background: url(https://priyachaudhary.com/pub/media/footer/footer-priya);
    position: relative;
    /* background: #f8f8f8; */
    padding: 40px 0;
    margin-top: 60px;
    height: 1200px
}

Вот рабочий пример: http://jsfiddle.net/sva7rkcp/4/

@Abu, прокрутите вниз, чтобы увидеть цветы

user10040839 10.08.2018 15:35

Другие вопросы по теме