Добавить фоновое изображение в строке Bootstrap

Я хотел бы вставить фоновое изображение полной ширины на эту часть моей страницы. Может кто-нибудь, пожалуйста, скажите мне, какое правило css я должен соблюдать? Потому что, насколько я знаю, вы не можете вставить фоновое изображение внутри строки. благодаряДобавить фоновое изображение в строке Bootstrap

<header> 
 
     <div class="container"> 
 
      <div class="row"> 
 
       <div class="col-lg-12"> 
 
        <img class="img-responsive" src="img/profile.png" alt=""> 
 
        <div class="intro-text"> 
 
         <span class="name">HEADING</span> 
 
         <hr class="star-light"> 
 
         <span class="skills">TEXT</span> 
 
        </div> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </header>

источник

2016-02-14 aptbs85

Вы хотите сделать тег фоном для заголовка и текста? –

Я думаю, что это не нереально, что вам нужно: https://jsfiddle.net/yym7d1ov/ –

Если вы хотите добавить фоновое изображение, <img> - это не путь. Используйте свойство background-image.

<header> 
    <div class="container"> 
    <div class="row" 
     style="background:transparent url('img/profile.png') no-repeat center center /cover"> 
     <div class="col-lg-12"> 
     <div class="intro-text"> 
      <span class="name">HEADING</span> 
      <hr class="star-light"> 
      <span class="skills">TEXT</span> 
     </div> 
     </div> 
    </div> 
    </div> 
</header>

Обратите внимание, что добавление встроенного стиля не рекомендуется, я использовал его демонстративно здесь. Правильный способ стилизации вашего div состоял бы в том, чтобы добавить к нему определенный класс или идентификатор и стилизовать его внутри ваших файлов CSS.

В фрагменте выше я использовал стенографию background, чтобы установить background-image. Эта стенограмма позволяет установить фон color, image, position, repeat, origin, clip и size в одном объявлении. Они должны быть в таком порядке. Вы можете пропустить любой из них, а size должен иметь префикс /.

Совет: запомнить порядок их я использую термин procs (должно быть ciprocs, но procs легче связать и тот факт, что цвет и изображение первые два тоже легко).

источник

2016-02-14 20:42:40

, возможно, рассмотрите также «background-size: cover;». – walkerrandophsmith

Вы можете установить в файле CSS в background-image: url('img.png') свойство, чтобы определить его.

Для получения дополнительной информации смотрите here.

источник

2016-02-14 20:42:04 OmerM25

Добавить фоновое изображение в строке Bootstrap

ответ

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