Background-image et css

Bonjour,

En CSS, il vaut mieux écrire:

body {

  background: #123456 url(./dossier/image.gif) repeat left top;

  background-attachment: fixed;

  ...

}

...

Au passage, tu remarqueras que le nom de l'image n'est pas entre guillemets !

A+

Merci pour ta réponse.

Avant de poser ma question, j'avais fait un petit tour sur différents sites traitant du sujet. J'y ai lu l'instruction background-image écrite de différentes façons: avec double cotes, avec simple cotes et sans cotes (comme tu le préconises). J'avais, bien entendu, tenté toutes les options possibles sans que cela ne donne de résultat.
J'ai suivis ton conseil en modifiant l'instruction css comme ceci :

body

  {

    [b]background: #123456 url(fond_page.jpg) repeat left top;[/b]

    /* background-repeat:repeat; */

    background-attachment:fixed;

    margin-top:15px;    

    padding:0px;

    margin-bottom:15px;

    font-size:13px;

    /* background-color:#CCCCCC; */

    font-family:Times New Roman, sans-serif;

    }

Bien entendu, j'ai masqué l'instruction background-image implémentée dans le fichier html.
Le seul résultat est l'apparition d'un background couleur, ce qui était déjà le cas avec l'utilisation de la fonction background-color. Mais toujours pas d'image de fond.
(Petite précision, les 3 fichiers css, html et jpg sont au même niveau d'arborescence).

Salut,

Merci de lire, d'accepter et de respecter le règlement. Toute pièce de code doit être présentée entre les balises [code] ... [/code].

Nan, môssieu  
Là où est stocké le .css  

 
C'est mieux comme ça ?...

On ne donne jamais assez de précisions sur la situation existante.
Voilà donc mon domaine de travail.
Tout se passe dans un répertoire local (ma machine) sur laquelle je mets au point une révision de mon site personnel qui ne contient que du html, du css et du java.
Le poids de l'image en question est minuscule (7 Ko)
Par contre j'ai commis une petite bévue en prétendant que, tout comme les deux autres fichiers concernés, mon fichier css se trouvait à la racine de ce répertoire. Car, en réalité, il se trouve dans un sous-répertoire nommé "Style" (où réside mes fichiers de style).
La solution était là.
En effet: l'image était à référencer à partir de l'adresse du fichier css et non à partir de l'adresse du fichier html.
Dès lors, ma ligne de commande doit s'écrire comme ceci (tout en respectant les prescrits déontologiques):

body

	  {

    background-image:url(../fond_page.jpg); (pour remonter du niveau Style à la racine)

    background-repeat:repeat;

    background-attachment:fixed;

    margin-top:15px;    

    padding:0px;

    margin-bottom:15px;

    font-size:13px;

    /* background-color:#CCCCCC; */ (que je conserve en commentaire)

    font-family:Times New Roman, sans-serif;

    }

Et cette fois: bingo !
LudoTools, merci pour tes interventions, elles m'ont permis d'y voir clair.

  tant mieux ! "On" est là pour ça...

Mais quand même... regarde donc côté simplification du CSS... c'est toujours ça de ligne en moins à interpréter.

Bon développement,
apluch'  

OK, merci pour le conseil.
Toutefois je ne prétends pas être suffisamment aguerri pour consigner mes codes autrement que de façon académique avec pour objectif, un projet réalisé en simple dilettante. Maintenant que celui-ci est bien en place et a une certaine notoriété de par son contenu, je m'attache un peu plus à son enveloppe.
Les questions ne vont pas manquer à commencer par celle-ci à laquelle j'ai trouvé une réponse (sur je ne sais plus quel site) mais pas la solution.

/* ATTENTION :

Le seul attribut de mise en forme qui reste dans le marquage de la page est l'attribut cellspacing (espacement des cellules) de la balise <table>. Pour autant que je sache, il n'y a aucun moyen de contrôler cet attribut particulier avec CSS. Logiquement, l'espacement des cellules semble correspondre aux marges dans le modèle CSS, mais la modification de l'attribut marge des cellules n'a aucun impact sur leur espacement au sein d'un tableau.

border-collapse:separate; avec border-spacing:10px; ne fonctionne pas */

 
 
table /* pour toutes les tableaux */

    {

    /* border-collapse: collapse; /*-> bordures collées */

    style-border: none; /* pas de bordures affichées */

    margin:0px; 

    border-spacing:10px;

    }

Foutus css...

Et padding au niveau de la cellule ?

Oui, c’est à essayer.
Par contre, c’est dans la page html, au niveau de la balise <table> qu’est la solution de rechange (qui manque toutefois de souplesse).

'lut !

Ceci fonctionne parfaitement... border-spacing à le même effet que cellspacing en hteumeuleu  

<html>

<head>

<style type="text/css">

table, th {

  border-collapse:separate;

  border-spacing:20px;

  border:1px solid black;

}

 
td {

  border:1px dotted red;

  padding:5px;

}

</style>

</head>

 
<body>

<table>

<tr>

<th>Colonne 1</th>

<th>Colonne 2</th>

<th>Colonne 3</th>

</tr>

<tr>

<td>Cellule 1.1</td>

<td>Cellule 1.2</td>

<td>Cellule 1.3</td>

</tr>

<tr>

<td>Cellule 2.1</td>

<td>Cellule 2.2</td>

<td>Cellule 2.3</td>

</tr>

<tr>

<td>Cellule 3.1</td>

<td>Cellule 3.2</td>

<td>Cellule 3.3</td>

</tr>

</table>

</body>

</html>

Mais bien sûr, si tu indiques border-collapse: collapse ... et bien les bordures sont collées, comme demandé !
Donc border-spacing n'a aucun effet ; ce qui est logique, puisqu'on les veut collées, elles ne peuvent pas être espacées de 20px...

Quant à padding au niveau de la cellule, cela ne fait que ce que ça doit faire... mettre un "padding" (un espace à l'intérieur de la cellule entre son bord et son contenu...).

Je n'en disconviens pas. C'est pourquoi la ligne incriminée est en commentaire.
De plus, mon souhait était de passer le paramètre via css (question souplesse) et non de l'indiquer dans le code html. Comme cela ne fonctionne pas, j'ai dû implémenter cellspacing dans la balise <table>. C'est toutefois un moindre mal dans la mesure où je ne pense pas devoir modifier ce paramètre (qui se répète tout de même sur plus de 200 pages…)

oui... mais
là, il y a une erreur de saisie... c'est peut-être pour cela que ça ne fonctionne pas...

Dans le code, l'ensemble est pourtant bien pris en commentaire. Si j'ai bonne souvenance, un commentaire ouvrant (/*) ne réagit qu'au seul commentaire fermant (*/).
Ensuite, ce code a été mis en commentaire après de multiples essais.

Dont acte...

Quoi qu'il en soit, mon souci était ailleurs et je te remercie pour l'aide que tu as apporté afin de le résoudre.

« Ah, parce que c'est résolu ? » demande le modérateur.

Meilleure réponse sélectionnée par DePhil.

Gasp! En quoi MA réponse mérite-t-elle d'être élue "meilleure réponse" ?
Si tu veux en choisir une autre, demande-le moi, je peux faire le changement.  

Voilà ce qui arrive lorsqu'on veut précipiter les choses…
Mais puisque tu insistes: le récipiendaire est: Ludo Tools, bien évidemment.

Lequel de ces messages veux-tu que je sélectionne ?

Celui qui m'a mis la puce à l'oreille est daté du 25-05-2011 à 11:25:58.

Oki. Si par ailleurs tu cherches à lier un message, tu peux utiliser l'adresse de ce message que tu trouveras justement sous la date de celui-ci. Par exemple, le message de LudoTools qui nous intéresse est le t49242.

Meilleure réponse sélectionnée par zeb DePhil.

Et voilà  

Merci à vous 2 d'avoir rendu à Jules ce qui appartient à César...  

... je peux encore changer de césar ...