Titre: Comment colorer l'exterieur d'une page
Posté par: kimble89 le le 04-12-2008 a 16:36:27
Bonjour,
Je souhaiterais colorerl'extérieur de ma page (l'entourage) pour délimiter
et mieux faire ressortir l'interieur de ma page qui est blanche.
Je n'arrive pas à trouver comment faire ?
Ou alors comment faire une bordure couleur pour toute la page ?
Je pense que c'est à partir du MWD ?
(La largeur de ma page est en 950px)
Quel est la balise qu'il faut modifier ?
Merci de votre aide.
Kimble
|
Titre: Re:Comment colorer l'exterieur d'une page
Posté par: souifi le le 04-12-2008 a 18:50:03
Faut que tu utilise la propriété body en css
body {
background-color:#000; /* #xxxxxx et le code hexadécimal (http://www.jokconcept.net/codes-couleurs-hexdecimal.php) de ta couleur */
background-image:url('http://mon-image.png'); /* pour utiliser une image comme fond */
background-repeat:repeat-x; /* repete l'image sur la largeur de la page */
background-repeat:repeat-y; /* repete l'image sur la hauteur de la page */
}
pour une bordure il y a le sélecteur border
#id_de_mo_div {
border: 1px solid #000;
}
http://www.cssdebutant.com/ (http://www.cssdebutant.com/) |
Titre: Re:Comment colorer l'exterieur d'une page
Posté par: kimble89 le le 04-12-2008 a 23:57:09
Bonsoir,
Merci de ta réponse. En effet ça marche , pour le fond comme pour les bordures
il y a juste une chose que je n'arrive pas à régler : c'est que mes balises Container , masthead,et Page content ont une largeur de 950px (width: 950px;)
J'ai aussi mis un width: 950px;sur ma balise body, mais en fait la bordure porte sur toute la largeur de l'écran et pas uniquement sur la largeur de 950px.
Comment faut-il faire?
Merci de votre aide
Kimble |
Titre: Re:Comment colorer l'exterieur d'une page
Posté par: souifi le le 05-12-2008 a 01:21:14
C normal "body" définit toute la page, après pour des élément particulier il faut les définir.
Code:
#conteneur_1 {
border: 1px solid #CCC;
}
|
|
Dans l'exemple ci-dessus, on appliquera des bordures grise seulement au bloc avec pour ID "conteneur_1"
Code:
<div id="conteneur_1">
tout ce qui se trouve entre ces deux balises se trouverons a l'intérieur de nos bordures grise
</div>
|
|
On peut aussi definir des class
Code:
.style_1 {
color: red; // on peut aussi definir une couleur par son nom anglais
}
|
|
Dans l'exemple ci-dessus, on appliquera la couleur rouge a tout le text ayant la class "style_1"
Code:
<div id="conteneur_1">
tout ce qui se trouve entre ces deux balises se trouverons a l'intérieur de nos bordures grise <span class ="style_1">et ce text en rouge</span>
</div>
|
|
Tu peut aussi definir un aspect precis pour chacune de tes balise
Code:
a {
text-decoration:none;
}
|
|
Aura pour effet de ne pas souligner tout les lien de ta page....
Bon bref tout sa pour te donner une idée de toutes les possibilités du CSS
Pour en revenir a ton cas, supprime ton ajout barbare de body (width: 950px;) créer un conteneur général de ta page si tu en as pas avec les propriétés CSS adéquate.
cela devrais ressembler a sa.
Code:
<html>
<head>
<style type="text/css">
#MON_CONTENEUR_GENERAL {
/* Different style de bordure => dotted,groove,solid,double,ridge,inset,outset...
Voila un petit panache de différentes possibilités en donnant un style respectivement aux bords gauche, droit, bas, haut */
border-left: dotted;
border-right: groove;
border-bottom: 1px solid #EEE;
border-top: 4px inset #999
}
</style>
</head>
<body>
<!-- debut du conteneur du site -->
<div id="MON_CONTENEUR_GENERAL">
<div id="Container">
blablabla...
</div>
<div id="masthead">
blablabla...
</div>
<div id="Page">
blablabla...
</div>
</div>
<!-- Fin du conteneur du site -->
</body>
</html>
|
|
|
Titre: Re:Comment colorer l'exterieur d'une page
Posté par: kimble89 le le 08-12-2008 a 20:58:26
Bonjour,
En effet les possibilités sont super nombreuses. Merci beaucoup pour les codes.
Kimble
|
Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.
|