CSS: Mon image s'affiche a moitié et se répète ainsi...
Fermé
Sims1234
Messages postés
7
Date d'inscription
lundi 30 décembre 2013
Statut
Membre
Dernière intervention
2 janvier 2014
-
30 déc. 2013 à 13:50
Sims1234 Messages postés 7 Date d'inscription lundi 30 décembre 2013 Statut Membre Dernière intervention 2 janvier 2014 - 2 janv. 2014 à 18:01
Sims1234 Messages postés 7 Date d'inscription lundi 30 décembre 2013 Statut Membre Dernière intervention 2 janvier 2014 - 2 janv. 2014 à 18:01
A voir également:
- CSS: Mon image s'affiche a moitié et se répète ainsi...
- Enlever couleur lien css ✓ - Forum CSS
- Css exposant ✓ - Forum CSS
- Mettre une image à gauche css ✓ - Forum CSS
- Css download - Télécharger - HTML
- Déplacer une image css - Forum CSS
4 réponses
animostab
Messages postés
2829
Date d'inscription
jeudi 10 mars 2005
Statut
Membre
Dernière intervention
11 novembre 2019
738
Modifié par animostab le 31/12/2013 à 14:39
Modifié par animostab le 31/12/2013 à 14:39
salut
.background{
position:fixed;
background-image: url("../images/background3.jpg");
background-repeat:no-repeat;
background-position:left top;
width:1000px;
height:1950px;
margin:50px;
margin-bottom:0;
padding:30px 20px;
background-color:#ffffff;
border:3px solid black;
opacity:1;
}
ton image doit avoir une taille de 1000 x 1950
si ce n'est pas le cas rajoute
background-size: 100% 100%;
ou
background-size: contain;
Un petit merci vaut mieux qu'une grande ignorance !
Donc si votre sujet est résolu une réponse avec merci c'est pas de refus.
.background{
position:fixed;
background-image: url("../images/background3.jpg");
background-repeat:no-repeat;
background-position:left top;
width:1000px;
height:1950px;
margin:50px;
margin-bottom:0;
padding:30px 20px;
background-color:#ffffff;
border:3px solid black;
opacity:1;
}
ton image doit avoir une taille de 1000 x 1950
si ce n'est pas le cas rajoute
background-size: 100% 100%;
ou
background-size: contain;
Un petit merci vaut mieux qu'une grande ignorance !
Donc si votre sujet est résolu une réponse avec merci c'est pas de refus.
jjaco
Messages postés
529
Date d'inscription
dimanche 20 janvier 2008
Statut
Membre
Dernière intervention
15 mars 2024
45
30 déc. 2013 à 20:41
30 déc. 2013 à 20:41
Il faudrait voir tout le code css et tout le code html
Sims1234
Messages postés
7
Date d'inscription
lundi 30 décembre 2013
Statut
Membre
Dernière intervention
2 janvier 2014
31 déc. 2013 à 10:24
31 déc. 2013 à 10:24
Voilà, j'espère que c'est pas trop brouillon comme je dis je débute :)
HTML:
CSS:
HTML:
<!DOCTYPE html> <html lang="fr"> <head> <meta charset="utf-8" /> <link rel="stylesheet" href="styles/style.css" /> <title>Light Heaven</title> </head> <body> <header> <img src="images/head.jpg" alt="Light Heaven" Title="Bienvenue chez Light Heaven"/> </header> <div class = "background"> <nav> <ul><li><a href="site.html"> Accueil<br/><br/><br/></a></li> <li><a href="carte.html"> Carte<br/><br/><br/></a></li> <li><a href="contact.html"> Contact<br/></a></li></ul> </nav> <h2> A la carte : </h2> <br/> <h3> Salades : </h3> <ul><li> Salade chèvre & bacon -- 10€</li> <li> Salade poulet maïs -- 9€</li> <li> Salade niçoise -- 10,5€</li> <li> Salade tomate mozzarella et basilic -- 9,5€ </li> <li> Salade saumon fumé et fenouille -- 12€</li></ul> <br/> <h3> Cuisine Chinoise : </h3> <ul><li> Boeuf sauté au riz -- 8,5€ </li> <li> Boeuf sauté aux nouilles - <em>"plat gourmand" </em>-- 9,5€</li> <li> Porc sauté au riz -- 7,5€</li> <li> Porc sauté aux nouilles -- 8,5€</li> <li> Riz aux légumes -- 7€ </li> <li> Riz aux oeufs -- 6,5€</li></ul> <br/> <h3> Cuisine Italienne : </h3> <ul><li> Pizza mozzarella -- 8,5€ </li> <li> Pizza prosciutto -- 9€</li> <li> Spaghetti bolognaise -- 8,5€ </li> <li> Spaghetti au pesto -- 7,5€</li> <li> Calzone quatre fromages - <em>"plat gourmand" </em>-- 8€</li></ul> <br/> <h3> Cuisine Française : </h3> <ul><li> Steak tartare 7,5€ </li> <li> Boeuf bourgignon -- -- 10,5€</li> <li> Magret de canard - <em>"plat gourmand" </em>-- 12€</li> <li> Confit de canard - <em>"plat gourmand" </em>-- 13€ </li></ul> <br/> <h3> Cuisine Marocaine :</h3> <ul><li> Couscous royal -- 10€</li> <li> Couscous agneau -- 8,5€ </li> <li> Tajine poulet au citron -- 11€</li> <li> Tajine agneau aux raisins et amandes -- 12€</li></ul> <br/> <h3> Cuisine au Grill : </h3> <ul><li> Assortiment de grillades (boeuf, porc, agneau) - <em>"plat gourmand" </em> 16€</li> <li> Asado de poulet -- 14€</li> <li> Asado de boeuf -- 14€</li> <li> Asado de fruits de mer - <em>"plat gourmand" </em>-- 16€</li></ul> </div> <footer> <p>Auteur : Simon Oldenhove - Création le 23 novembre 2013 - Tous droits réservés(ou presque).<br/> Contact information: <a href="mailto:someone@example.com">lightheaven@example.com</a></p> </footer> </body> </html>
CSS:
html, body{
background: url("../images/background.jpg") fixed;
height:100%;
margin:0px;
padding:0px;
}
*{
margin:0;
}
header{position:relative; top: 30px;margin-left:90px;}
audio{
position:fixed;
top: 10px;
right: 150px;
}
h1 {
margin-left:450px;
color: rgb(253,174,86);
font-size: 3em;
font-style: oblique;
font-family: Arial, "Trebuchet MS", serif;
text-shadow: 2px 2px 1px black;
}
p{
color: white;
text-align: center;
font-size: 1.5em;
font-family: Calibri, "Trebuchet MS", serif;
text-shadow: 2px 2px 0px black;
background-color: rgba(39,22,117, 0.3);
margin-top: 60px;
}
h2{
color: white;
text-align:center;
font-size: 1.8em;
font-family: Calibri,"Trebuchet MS",serif;
text-shadow: 2px 2px 1px maroon;
background-color: rgba(0,0,0,0.6);
margin-top:40px;
}
h3{ background-color: rgba(0,0,0, 0.6);
font-family: Calibri, serif;
color:white;
text-shadow: 2px 2px 0px black;
font-size: 1.7em;}
div.menu {
border: 5px groove rgb(39,22,117);
border-radius: 10px;
background: url("../images/plate2.jpg") no-repeat;
position: fixed;
left: 200px;
right:350px;
bottom: 80px;
top : 180px;
}
#accueil{
position:fixed;
bottom:0;
left:0;
right:0;
}
div.background{
background: url("../images/background3.jpg")fixed;
width:1000px;
height:1950px;
margin:50px;
margin-bottom:0;
padding:30px 20px;
background-color:#ffffff;
border:3px solid black;
opacity:1;
}
ul li {
padding:10px;
background-color: rgba(0,0,0, 0.6);
color: white;
font-family:Calibri, serif;
font-size: 1em;
border-bottom: 2px;
line-height: 1.7em;
text-align: left;
margin: 0.5em 0 0 0;
}
div.contact{
background: url("../images/resto.jpg") no-repeat;
margin : 100px 10px;
margin-bottom: 20px;
padding: 10px 10px;
height: 400px;
color:white;
text-shadow:2px 2px 1px black;
}
div#fond{
margin-right:170px;
}
form{
margin-right:100px;
}
textarea{
width: 335px;
height: 100px;
}
nav {
border: 1px solid rgba(13,19,69,0.8);
border-radius:10px;
background-color: rgba(13,19,69,0.8);
vertical-align: top;
padding-right:25px;
position: fixed;
padding-top: 175px;
right: 0px;
top: 0px;
bottom:0px;
}
nav ul li{
background-color:rgba(0,0,0,0);
font-size: 1.2em;
font-family:Calibri, serif;
}
a:visited{
color: white;
text-shadow: 2px 2px 1px maroon;
}
a:hover{
color: blue;
text-decoration: underline;
}
a{
color: white;
text-shadow: 2px 2px 1px black;
}
footer{position:relative; bottom:0;width:90%;overflow: hidden;}
footer p{
border-top: 2px solid rgba(13,19,69,0.8);
border-radius:2px;
position:relative;
bottom:0;
font-size:1em;
font-family:"Lucida Sans Typewriter", serif;
background-color: rgba(13,19,69,0.9);
text-shadow:0 0 0 white;
color: white;
overflow: hidden;
}
Sims1234
Messages postés
7
Date d'inscription
lundi 30 décembre 2013
Statut
Membre
Dernière intervention
2 janvier 2014
2 janv. 2014 à 18:01
2 janv. 2014 à 18:01
Merci à toi animostab !
