Background ne suit pas le scroll (zut!) - HTML/CSS - Programmation
Marsh Posté le 22-04-2015 à 08:42:34
tiens :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="shortcut icon" href="./icone.ico" type="image/x-icon"/>
<link rel="icon" href="./icone.ico" type="image/x-icon"/>
<link rel="stylesheet" href="pagecss2.css" />
<meta content="" name="description" />
</head>
<title>
MON SITE
</title>
<body>
<header>
<a href="index.html"> <img src="./banniere.gif" height="70%" width="70%" alt="banniere" /> </a>
</header>
<h3>
<b>
-MES BOUTONS-
</b>
</h3>
DU TEXTE
</body>
<footer>
<b>
<a href="index.html"> acceuil </a> - <a href="SITEWEB2.html"> nos activités </a> - <a href=".html"> nos vehicules </a> - <a href="entrep.html"> notre entrepot </a> - <a href="contact.html"> contact </a>
© INFOCLIENT
</b>
</footer>
<br>
</html>
voilou
Marsh Posté le 22-04-2015 à 09:37:52
Solution trouvé : Ce que je cherchais était en fait l'opposé de scroll et mon problème s'est résolus comme ceci :
body
{
text-align:center;
background-image: url('auto.bmp');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100%;
}
de cette manière le texte passe au dessus du background et celui-ci ne bouge pas.
Marsh Posté le 22-04-2015 à 11:58:21
Meilleure solution pour avoir un beau fond qui prend toute la page et que quand on scroll le body bouge et le fond reste bien derrière :
body
{
text-align:center;
background-image: url('contact.bmp');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-position : center center;
}
En esperant aider quelqun qui tomberai sur ce topic
Marsh Posté le 21-04-2015 à 16:44:10
Bonjour, Mesdammes, Messieurs,
Je suis confronté à un soucis assez particulier mon background ne suis pas le "scroll" de ma page html.
Pourtant voici mon css : JE NE VOIS PAS DU TOUT D'OU VIENS L'ERREUR.
Donc si quelqu'un peut m' éclairer sur ce problème pourtant simple ce serait chouette merci.
html
{
}
body
{
text-align:center;
background-image: url('fond.bmp');
background-repeat: no-repeat;
background-attachment: scroll;
}
header
{
text-align:center;
width:100%;
font-family: candara;
}
a:visited /* Quand le visiteur a déjà vu la page concernée */
{
color: black; /*Appliquer une couleur*/
}
a:link
{
color: black;
text-decoration:none;
font-family: 'Digital_Sans_EF_Medium';
}
a:hover /* Apparence au survol des liens */
{
text-decoration: underline;
color: rgb(9,45,19);
}
footer
{
border-width: 30px;
border-radius: 5px;
background-color: rgb(26,159,230);
box-shadow: 6px 6px 6px black;
font-size: 14px;
text-align: center;
position: relative;
min-height: 10px;
line-height: 20px;
font-family: candara;
}
h3
{
}
p
{
font-size: 18px;
text-align: center;
font-family: candara;
}
h4
{
text-align:center;
font-size: 21px;
font-family: candara;
}
h2
{
text-align:center;
font-size: 21px;
font-family: candara;
}