2016-09-29 4 views
0

Я пытаюсь использовать изображение в качестве фона для моего jumbotron и не могу получить изображение для показа. Я могу изменить другие свойства jumbotron просто отлично, но не могу понять, что я делаю неправильно с фоновым изображением.Как получить фоновое изображение на Bootstrap jumbotron

Вот мой HTML

<header> 
     <div class="jumbotron"> 
      <div class="container"> 
      <h1 class="display-3"> Large Text </h1> 
      <h1 class="display-4"> Smaller Text </h1> 
      <p><a href="#" class="btn btn-success btn-lg">Learn More »</a></p> 
     </div> 
     </div> 
     </header> 

... и вот мой CSS

.jumbotron { 
     background: url("img/banner.jpg"); 
     color: black; 
     } 

почему я не могу получить эту работу? Мой путь к файлу определенно правильный.

Заранее благодарим за вашу помощь!

+0

Я изначально ответил на это, сказав, что Bootstrap, вероятно, отменяет вашу декларацию «background». Однако кажется, что Bootstrap не использует 'background', но вместо этого использует' background-color', поэтому мой ответ был неправильным. Я советую вам дважды проверить, чтобы ваш файл был определен правильно, поскольку я считаю, что вы должны быть действительными. –

+0

, просто выполнив быстрый тест (http://imgur.com/a/RFa73), не должно быть никаких проблем с тем, как вы их делали. Почему ваш jumbotron в вашем заголовке? – Craicerjack

+0

Вы проверили свои инструменты для разработчиков? Правило css применяется к вашему «jumbotron» div? (щелчок правой кнопкой мыши -> элемент проверки может помочь ...) – tgogos

ответ

-1

он должен работать увидеть http://jsfiddle.net/C4Sjg/538/

.jumbotron{ 
    background-image: url(https://www.google.co.in/logos/doodles/2016/ladislao-jose-biros-117th-birthday-5067428201496576-res.png); 
    color:white; 
} 

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

+1

Как это ответить на вопрос? – Craicerjack

+0

да, вы правы, мой плохой, Nate должен отладить код и посмотреть, что вызывает проблему. – Rahul

-1

Спасибо за ваши ответы всем! Я закончил с другим путем и просто поместил фоновое изображение, которое я хотел в теле, а не в jumbotron. Затем я просто сделал jumbotron фона прозрачным, чтобы получить фоновое изображение.

+0

Можете ли вы предоставить код для этого решения? Это поможет другим, которые имеют такие же проблемы в будущем. – soundslikeodd

Смежные вопросы