Sujet Précédent Sujet Suivant

Mon background-image ne s'affiche pas (HTML - CSS)

Résolu/Fermé
THOMAS - 25 nov. 2019 à 21:40
 THOMAS - 25 nov. 2019 à 23:00
Bonjour,
J'étudie actuellement les bases de l'HTML et du CSS.
J'aimerais mettre image en fond sur une seule page de mon site (il s'agit de l'accueil).

J'ai déjà regarder beaucoup de Tuto en suivant les étapes et mettant le même code qu'eux.
Ca ne marche toujours pas.

Voici le code HTML :

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset ="utf-8">
<title>LinkedIn</title>
<link rel="stylesheet" href="../CSS/style.css"/>
</head>

<body>
<header class="linovu">
Linovu
</header>

<nav>

<ul class="list">
<li><a href="../accueil/accueil.php" class="menu">Accueil</a></li>
</ul>

</nav>

<section class="acceuil">
</section>

<footer>
<p>Copyrigth 2019 - Danny Thomas</p>
</footer>
</body>
</html>

Voici le code CSS de tout le site:
body
{
font-size: 15px;
font-family : times new roman;
}

.nom
{
color: #20B2AA;
font-weight: bold;
text-align:center;
font-size : 25px;
}
h2
{
color : #20B2AA;
font-size : 20px;
}

aside
{
position: fixed;
margin-top : 10px;
margin-right: 0px;
margin-left:1200px;
margin-bottom:0px;
background:r;
border-radius:9px;
border : 5px solid #C0C0C0;
color : #20B2AA;
}

header
{
position : relative;
text-align:center;
background:#C0C0C0;
margin-bottom: 0px;
margin-right: 0px;
margin-left: 0px;
}

section
{
position:absolute;
margin-left:0px;
margin-top:0px;
}

footer
{
position:static;
background: linear-gradient(#20B2AA,#C0C0C0);
text-align:center;
color : white;
padding-top : 10px;
padding-bottom : 10px;
margin-top : 900px;
}

nav > ul
{
list-style-type:none;
margin-top:0px;
margin-bottom:0px;
padding:0px;
overflow:hidden;
background-color:#C0C0C0;
}

nav > ul > li
{
float:left;
}

li a
{
display:inline-block;
color:white;
text-align:center;
padding: 14px;
text-decoration:none;
}

li a : hover
{
background-color:red;
}

.menu
{
background-color:#20B2AA;
}

div
{
width : 1000px;
}

.linovu
{
font-size: 30px;
text-decoration: none;
color:white;
background:#C0C0C0;
font-weight : bold
}

.acceuil
{
background-repeat : no-repeat;
background-image : url(../image/fond.jpg);
background-position: cover;
}


Merci d'avance pour votre précieuse aide !

Thomas
A voir également:

1 réponse

Réponse 1 / 1
lugdanum Messages postés 108 Date d'inscription vendredi 13 mai 2005 Statut Membre Dernière intervention 14 novembre 2021 39
25 nov. 2019 à 21:55
Hello

Comme ça à première vue, ta section (class="acceuil") est vide, du coup ton background ne peut pas s'afficher... Ajoute du texte au moins (<div>....<p>Exemple</p>...</div>...)

Regarde ici :
https://www.w3schools.com/cssref/pr_background-image.asp

ou encore :
https://www.w3schools.com/htmL/html_images_background.asp

@+

_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
Ma réponse t'a un peu aidé ? Si oui, un petit merci... Merci.
1
THOMAS
25 nov. 2019 à 23:00
Le site m'a aidé ! Merci beaucoup !!!
0

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?
Raven -
bonjou -

9 réponses
programme qui n'affiche pas le mot secret
EMy.chev -
yg_be -

3 réponses
[CSS] Forcé retour à la ligne
aKuma59 -
zigoss -

33 réponses