28111 sujets

CSS et mise en forme, CSS3

Redimensionner une image située en background ?

Bonjour,
J'ai une image qui sert de background à un div, ex : background-image: url(../images/toto.jpg. Je souhaite agir sur ce div via une page en responsive. Comment dois-je procéder pour modifier la taille de l'image...
Merci.
Hello,
Merci pour la réponse.
Je tourne en rond, j'aimerais que le div '.bloc-article' s'ajuste en fonction de la fenêtre du navigateur; sachant que ce div doit contenir à terme des images et du texte.
Je joins le code de test sur lequel je travaille...
Merci.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document sans nom</title>
<style type="text/css">
.container {
	display: flex;
	max-width: 1100px;
	margin-right: auto;
	margin-left: auto;
	flex-wrap: nowrap;
}

.bloc-article {
	background-image: url(background_article.png);
	background-repeat: no-repeat;
	background-size: 100% 100% cover;
	/*height: 140px;
	width: 760px;*/
	height:140px;
	width: 100%;
	background-color: #F00;
}
body {
	background-color: #ccc;
	margin: 0px;
}
@media screen and (max-width: 600px){

.bloc-article {
	background-image: url(background_article.png);
	background-repeat: no-repeat;
	background-size: 100% 100% cover;
	height: auto;
	max-width: 100%;
	background-color: #F00;
}



body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #00f;
}

.colonne-pub {
	display:none;
}


.colonne-article {
	max-width: 100%;
}


}


.colonne-article {
	background-color: #0F0;
	width: 69%;
}
.colonne-pub {
	background-color: #FF0;
	text-align: center;
	width: 31%;
}

</style>
</head>

<body>
<div class="container">
  <div class="colonne-pub"><img src="pub-modele.jpg" width="280" height="350"></div><!--colonne-pub-->
  <div class="colonne-article">
    <div class="bloc-article">texte</div>
  </div><!--colonne-article-->
</div><!-- container -->
</body>
</html>
Sujet clos
Aller à