Bootstrap 3 - Jumbotron image d'arrière-plan
Je vais avoir de la difficulté à mettre une image de fond pour bootstrap jumbotrons. Mon principal.css vient après le bootstrap css et je suis en sélectionnant le jumbotron à l'aide d'une classe appelée "bannière" qui est dans la même div que le jumbotron, mais cela ne fonctionne toujours pas. Voici mon code...
HTML:
<!-- Banner -->
<div class="jumbotron banner">
<div class="container">
<hgroup>
<h1>
Bits king
</h1>
<h2>
Web Design & Development
</h2>
</hgroup>
</div>
</div>
CSS:
.banner {
height: 400px;
width: 100%;
max-height: 50%;
max-width: 100%;
min-height: 20%;
min-width: 30%;
background-image: url("../assets/images/banner.jpeg");
background-size: cover;
}
- Oeuvres dans le présent code pen.. assurez-vous que votre chemin vers l'image est correcte. Quel est le navigateur de la console de dire? codepen.io/yongchuc/stylo/oYZMdr
- Double Possible de Ajouter une image de fond à un <div> élément
Vous devez vous connecter pour publier un commentaire.
Vous pouvez ajouter un
background-image
propriété de la.jumbotron
classe dans votre fichier css spécifique (assurez-vous de référence personnalisé de votre fichier css après Bootstrap. Voici un exemple:ajouter "jumbotron-custom" à l'attribut de classe et d'appliquer cette après "bootstrap" css :
..ou simplement à ajouter !important à votre "background-image" de css.
Bon Matin. Essayez ceci:
Laissez-moi savoir si cela fonctionne ou pas?