Ajouter image d'arrière-plan dans le Bootstrap ligne

Je voudrais insérer une pleine largeur de l'image de fond sur cette partie de ma page. Quelqu'un pourrait-il me dire qui règle css je dois suivre? Parce que comme je sais que vous canot insérer une image d'arrière-plan à l'intérieur d'une ligne. grâce

HTML:

    <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>

  • Voulez-vous faire un <img> tag image de fond pour le Titre et le Texte de la partie?
  • Je pense que ce n'est pas irréel ce dont vous avez besoin: jsfiddle.net/yym7d1ov
InformationsquelleAutor aptbs85 | 2016-02-14
  1. 14

    Lorsque vous souhaitez ajouter une image de fond, <img> est pas la voie à suivre. Utiliser le background-image propriété.

    <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>

    Veuillez noter que l'ajout de style en ligne n'est pas recommandé, je l'ai utilisé démonstratif ici. La bonne façon de le style de votre div serait l'ajout d'une classe spécifique ou d'un ID et d'un style à l'intérieur de vos fichiers CSS.

    Dans l'extrait ci-dessus, j'ai utilisé le background abréviation de propriété pour définir le background-image. Cette abréviation permet la mise en arrière-plan color, image, repeat, origin, clip, position et size dans une seule déclaration. Vous pouvez sauter l'un d'eux, mais size doit être préfixé avec un / et juste après position.

    • peut-être envisager de background-size: cover; ainsi.
    • Andrei solution inclut les background-size règle, mais inclus dans la version courte.
    InformationsquelleAutor Andrei Gheorghiu
  2. 0

    Vous pouvez mettre dans votre fichier css le background-image: url('img.png') de la propriété à définir.

    Pour plus d'options de prendre un coup d'oeil ici.

    InformationsquelleAutor OmerM25