Mise en page HTML
Résolu
Bonjour,
Je voudrais savoir si quelqu'un sait comment mettre un carré blanc en arriere plan mais devant l'arriere plan que j'ai mis(images verte) pour pouvoir faire une zone ou mon site sera détaillé =, je souhaite qu'il parte de la hauteur de mon menu, mais je suppose que si je peux faire un carré je pourrai le placé avec width et height, voila . Et j'ai déjà essayé ca:
merci
Je voudrais savoir si quelqu'un sait comment mettre un carré blanc en arriere plan mais devant l'arriere plan que j'ai mis(images verte) pour pouvoir faire une zone ou mon site sera détaillé =, je souhaite qu'il parte de la hauteur de mon menu, mais je suppose que si je peux faire un carré je pourrai le placé avec width et height, voila . Et j'ai déjà essayé ca:
<body background="fondblanc.png">
merci
11 réponses
Résumé de la discussion
La problématique consiste à afficher un carré blanc au sein d'une page, devant l'arrière-plan vert, afin de délimiter une zone de contenu qui démarre à la hauteur du menu. Des suggestions initiales privilégient l'utilisation de CSS via une balise style et d'éviter l'attribut body background, avec des dimensions déterminées et des bordures arrondies selon les besoins. La solution la plus complète proposée montre un carré blanc défini par une classe ".carre_blanc" avec width: 900px et background-color: white, complété par des radii pour arrondir les angles. En parallèle, d'autres échanges soulignent l'importance d'apporter le code exact et de préciser où l'intégrer, certains évoquant des scripts et l'emploi d'outils comme Notepad++, ce qui illustre la diversité des approches et des contraintes.
-
ModérateurSalut
Je ne comprend pas vraiment.
Tu à ton site en ligne pour montrer ? Ou une image montrant ce que tu veut faire ? Comment est crée ton site ?
-
D'accord alors ca c'est mon css:
body {font: normal .8em/1.5em Arial, Helvetica, sans-serif;background:url(http://ekladata.com/De-4l894o1LJ0fZv8QCqg4U9VYI@1597x1597.jpg);width: 900px;margin: 100px auto;color: #666;} a {color: #333;}
ca donne mon fond d'ecran et je souhaiterai placer une image(fond blanc) devant mon arriere plan mais qui resterai derrière mon texte-
-
voila le debut:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>King-bracelet</title>
<link href="css/style2.css" rel="stylesheet" type="text/css" />
<img src="images/new.png" alt="Nouveau !" /
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="WOW Slider, carousel jquery, wordpress slider" />
<meta name="description" content="WOWSlider created with WOW Slider, a free wizard program that helps you easily generate beautiful web slideshow" />
<!-- Start WOWSlider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
</head>
<body>
ICI IL Y A MON MENU
ET MON DIAPORAMA
</body>
</html> -
-
-
Voila je voudrai donc un arriere plan comme dans la 2eme -
Tu créé une DIV sur laquelle tu applique ton fond blanc.
Exemple html:
<div class="carre_blanc">
</div>
Exemple css :
.carre_blanc{
background-color:white; /** ou #FFFFFF **/
width:50px; /** tu définis la largeur de ton carré blanc **/
height:50px; /** tu définis la hauteur de ton carré blanc **/
} -
merci dem'avoir repondu mais malheureusement ca fait un carré blanc mais il ne se metspas en fond, il décale tout :/
-
Peux-tu me donner ton code et me dire exactement ou tu veux le mettre ton carré blanc ?
-
Après ton menu et en restant dans la balise body tu encadres ton contenu avec :
<div class="carre_blanc"><!--Début du carré blanc-->
</div><!--Fin du carré blanc -->
Dans ton fichier css tu insère :/**** CARRE BLANC*****/
.carre_blanc{
margin:0 auto;
width:900px;
background-color:white;
}
Je n'ai pas vérifier la largeur de ton site mais s'il fait 960px ou 1000px tu peux le modifier dans ton css.
La hauteur se réglera automatiquement en fonction de ton contenu, mais tu peux aussi la définir directement en intégrant un height dans ton css. -
ha!merci ca y est ca marche une derniere chose tu sais comment enlever le saut de lignes avant la balise <div>?
-
tu parles du </br> ? si c'est le cas tu as juste à le supprimer
-
Merci de m'avoir aider j'ai commencer il y a une semaine alors je suis un peu long^^ bonne journée et encore merci!
-
pour que le carré blanc colle ton menu, applique un petit padding et réduit ta largeur en fonction du padding :
/**** CARRE BLANC*****/
.carre_blanc{
margin:0 auto;
width:860px;
background-color:white;
padding:20px;
}-
c'est bon j'ai arrondi les bordde 30px comme ca
/**** CARRE BLANC*****/
.carre_blanc{
margin:0 auto;
width:900px;
background-color:white;
-webkit-border-top-left-radius: 30px;
-moz-border-radius-topleft: 30px;
-webkit-border-top-right-radius: 30px;
-moz-border-radius-topright: 30px;
-webkit-border-bottom-left-radius: 9px;
-moz-border-radius-bottomleft: 9px;
-webkit-border-bottom-right-radius: 9px;
-moz-border-radius-bottomright: 9px;
} -
-
-
