Mise en page HTML

Résolu

deadangel04 Messages postés 118 Statut Membre -
deadangel04 Messages postés 118 Statut Membre - 8 juil. 2014 à 11:15

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:

<body background="fondblanc.png">

merci

Afficher la suite

11 réponses

Réponse 1 / 11
Pierrecastor Messages postés 10830 Date d'inscription Statut Modérateur Dernière intervention 4 215

Salut

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 ?
0

deadangel04 Messages postés 118 Statut Membre 34

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

Pierrecastor Messages postés 10830 Date d'inscription Statut Modérateur Dernière intervention 4 215

Tu n'a pas répondu à ma dernière question. Comment est crée ton site ?

Et pourrait tu faire une image rapide sous paint pour montrer ce que tu veut obtenir ?
0

deadangel04 Messages postés 118 Statut Membre 34

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>

Pierrecastor Messages postés 10830 Date d'inscription Statut Modérateur Dernière intervention 4 215

https://forums.commentcamarche.net/forum/affich-30473337-mise-en-page-html#3
0

Réponse 3 / 11
deadangel04 Messages postés 118 Statut Membre 34

Voila je voudrai donc un arriere plan comme dans la 2eme
0
1. deadangel04 Messages postés 118 Statut Membre 34
  
  j'espere que tu as compris parcqu'on vois rien la^^
  
  0
2. Pierrecastor Messages postés 10830 Date d'inscription Statut Modérateur Dernière intervention 4 215
  
  Tu n'a pas répondu à ma dernière question. Comment est crée ton site ?
  
  0
3. deadangel04 Messages postés 118 Statut Membre 34
  
  Je ne comprend pas ta question tu veux des codes ?
  
  0
4. Pierrecastor Messages postés 10830 Date d'inscription Statut Modérateur Dernière intervention 4 215
  
  Tu crée ton site à la main sur un éditeur de texte ? Ou passe tu par un autre type de logiciel ? Ou par un moteur de site en ligne ?
  
  0
5. deadangel04 Messages postés 118 Statut Membre 34
  
  je le créé a la main, avec notepad++
  
  0
Réponse 4 / 11
resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4
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 **/
}
```
0
1. deadangel04 Messages postés 118 Statut Membre 34
  
  ah! merci je vais essayer ca tout de suite
  
  0
2. resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4
  
  N'oublies pas les balise de style si tu travail directement sur ta page HTML :
  <style type='text/css'>
  </style>
  
  0
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Réponse 5 / 11
deadangel04 Messages postés 118 Statut Membre 34

merci dem'avoir repondu mais malheureusement ca fait un carré blanc mais il ne se metspas en fond, il décale tout :/
0
Réponse 6 / 11
resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4

Peux-tu me donner ton code et me dire exactement ou tu veux le mettre ton carré blanc ?
0
1. deadangel04 Messages postés 118 Statut Membre 34
  
  je l'ai envoyer dans tes messages
  
  0
2. deadangel04 Messages postés 118 Statut Membre 34
  
  mon carré blanc je veux qu'il parte du menu et qu'il descende jusqu'en bas
  
  0
3. deadangel04 Messages postés 118 Statut Membre 34
  
  euh dans le code il manque des script et 2 css mais yen a beaucoup
  
  0
Réponse 7 / 11
resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4
Après ton menu et en restant dans la balise body tu encadres ton contenu avec :
```
<div class="carre_blanc">

</div>
```
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.
0
1. deadangel04 Messages postés 118 Statut Membre 34
  
  le carré est bien sur la page mais je ne peux pas écrire par dessus le carré
  
  0
2. resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4
  
  Tu encadre le contenu avec ces balises, c'est a dire que tout ce que tu mettras dedans sera au premier plan et dans le carré.
  Je pourrais te donner le code tout fait mais ça ne serait pas te rendre service, je pense avoir été clair...
  
  0
3. deadangel04 Messages postés 118 Statut Membre 34
  
  désolé d'avoir été lent a comprendre...^^
  
  0
Réponse 8 / 11
deadangel04 Messages postés 118 Statut Membre 34

ha!merci ca y est ca marche une derniere chose tu sais comment enlever le saut de lignes avant la balise <div>?
0
Réponse 9 / 11
resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4

tu parles du </br> ? si c'est le cas tu as juste à le supprimer
0
Réponse 10 / 11
deadangel04 Messages postés 118 Statut Membre 34

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!
0

resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4

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;
}

deadangel04 Messages postés 118 Statut Membre 34

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;
}

resecu Messages postés 18 Date d'inscription Statut Membre Dernière intervention 4
Allège ton code :
```
-moz-border-radius: 30px 30px 9px 9px;
-webkit-border-radius:  30px 30px 9px 9px;
```
0
deadangel04 Messages postés 118 Statut Membre 34

merci :D
0

Mise en page HTML

11 réponses

Discussions similaires

Newsletters