Créer un background répétitif?

Question simple

8 avril 2006 à 5:10:38

Bonjour, en passant je suis nouvau sur le site!

Bref, je veux faire un background qui va se répéter, mais j'ignore comment faire pour que le pattern de mon site web fonctionn bien.

Voilà le design en question: http://www.qc-graphix.net/eric/portfolio-site.jpg

Je sens que ça va être quelque chose de compliqué à coder comme première découpe, mais ce n'est pas grave j'aime bien les gros défis.

Je dois aussi faire marcher l'ombre du design dans le pattern.

Sinon, c'est un peu hors-sujet mais je n'ai pas trouvé de fonction "Recherche" sur les forums, savez-vous où elle est?

Merci beaucoup de votre aide!

-Éric

Spiky

8 avril 2006 à 10:27:50

Pour une première découpe je te souhaite bonne chance... Tu vas chipoter des heurs pour arriver à un résultat... Si je peux te donner un conseil, ce serait de découper tes cadres arrondis sur un fond transparent (pour moins de chipotage pour arriver à concorder avec le bg), et pour l'ombre en dessous, je ne sais pas comment tu vas t'y prendre... En tous cas pour que tu puisse répéter ton background il suffit just de mettre ceci, il se répètera tout seul:

body {
background: url('images/bg.gif');
}

Pour la fonction recherche, elle se trouve dans le menu de gauche en avant dernière position

Éric012

8 avril 2006 à 15:22:45

Merci pour la réponse.

J'ai un petit problème quand j'essaye d'utiliser cette fonction. Le background n'affiche pas dutout.

Voici un exemple parfait de ce qui m'arrive:
Je met la fonction exactement comme vous me l'avez demandé et voici ce que ça me donne:
http://qc-graphix.net/eric/decoupes/portfolio1/portfolio.html

Voici les deux codes que j'y ai insèré:

<!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" xml:lang="fr" >
<head>
<title>Exemple d'utilisation de CSS externe</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design sombre" href="sombre.css" />
</head>
<body background="design/bg.gif">
<p>Cette page comporte une feuille de style externe. C'est la meilleure méthode à utiliser quand on fait du CSS.</p>

<h1>Titre super important</h1>
<h2>Titre important</h2>
<h3>Titre un peu moins impo
<h4>Titre pas trop important</h4>
<h5>Titre pas important</h5>
<h6>Titre vraiment pas important du tout</h6>
</body>
</html>

body {
background: url('design/google.gif');
}

h1, h2
{
color: red;
}

p
{
font: Arial;
font-size: 15px;
color: white;
}

Et pourtant rien n'affiche, tandis que si je fais juste mettre dans le body en HTML et non en css la fonction suivante ça marche:
<body background="design/bg.gif">

Voici le résultat que j'obtiens:
http://qc-graphix.net/eric/decoupes/portfolio2/portfolio.html

Voici le code HTML:

Je trouve cela vraiment étrange, c'est comme mon css, il n'apparrait pas dans la partie HTML, je mets une fonction du genre:

h1
{
color: red;
}

Et dans ma partie HTML mon texte est bien normal noir au lieu d'être rouge.

Merci de m'aider à comprendre d'avantage car je suis un peu mélangé.

-Éric

Spiky

8 avril 2006 à 16:43:51

Tout simplement parce que ton css (sombre.css) ne se trouve pas à l'endroit indiqué...

Éric012

8 avril 2006 à 17:48:03

Voici ce que j'ai maintenant, http://qc-graphix.net/decoupes/portfolio

Le background affiche pas en css:

body {
background: url('design/bg.gif');
}

h1, h2
{
color: red;
}

p
{
font: Arial;
font-size: 15px;
color: white;
}

et pout le XHTML:

<!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" xml:lang="fr" >
<head>
<title>Exemple d'utilisation de CSS externe</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Portfolio" href="design/design.css" />
</head>
<body>
<p>Cette page comporte une feuille de style externe. C'est la meilleure méthode à utiliser quand on fait du CSS.</p>

<h1>Titre super important</h1>
<h2>Titre important</h2>
<h3>Titre un peu moins impo
<h4>Titre pas trop important</h4>
<h5>Titre pas important</h5>
<h6>Titre vraiment pas important du tout</h6>
</body>
</html>

Merci beaucoup pour ton aide!

-Éric

Éric012

9 avril 2006 à 18:59:18

EDIT: PROBLÈMES RÈGLER.

-Éric