Ajout d'une image d'arrière-plan en CSS

Question

J'essaie d'ajouter une image d'arrière-plan à mon premier panneau sur mon site Web d'une page. Pour une raison quelconque (que je ne peux pas comprendre), mon image de fond ne se chargera pas. S'il vous plaît aider!

HTML:

<!-- panel 1 --> 
<div class="header"> 
<h3> Introducing the </h3> 
<h1> Vespa Tribute </h1> 
<p> Scheduled for release in June 2016, this limited edition scooter will only  be produced 250 times. Enter your email below to be partnered with a Vespa representative who will ensure that you stay updated and informed about how be part of this exclusive venture. </p> 
<input type="text" name="emailaddress" placeholder="Email address"> 
<button type="button">Get exclusive Info</button> 
<img src="images/vespa1.png" alt="vespa" /> 

CSS:

/* PANNEAU * HEADER/

.header { 
background-image: url('images/image1.png'); 
background-size: cover; 
background-repeat: no-repeat; 
} 

Answer 1

Votre div n'est pas fermée, mais je suppose que vous ai tout simplement pas collé le code entier.

Votre code CSS indique HEADER PANEL - cela signifie-t-il que vous n'utilisez pas cela comme feuille de style séparée? Si c'est dans une feuille séparée, vous devez spécifier le chemin par rapport à l'emplacement de la feuille de style plutôt que le HTML. Travaillez-vous depuis votre propre machine ou teste-t-on ce code sur un serveur live?

Travaillez-vous dans un CMS ou un autre add-on avec sa propre bibliothèque CSS?

Je vous recommande de faire ce que Nathan a suggéré en vous assurant que c'est le bon chemin de fichier en le chargeant à partir de la barre d'adresse.

Ensuite, je vais essayer spécifier le chemin du fichier exact si vous testez ce code en direct - « http://server.com/images/image1.png »

Après cela, si elle est ne fonctionne toujours pas et le filepath est correct, essayez d'ouvrir toutes les feuilles de style liées et trouver toutes les valeurs associées à l'élément 'img' - les supprimer un par un tout en rafraîchissant votre page entre les deux pour localiser le code en conflit.

Cela me semble bien, donc je serais surpris s'il n'est pas corrigé par l'une de ces suggestions.