Forum de l’article

Edito

Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Rappel de la discussion
Mettre un fond dans la noisette
Sylvain Le Doaré - le 12 novembre 2019

Bonjour,
J’aurais voulu mettre un fond dans cette noisette.
Je pense qu’il faut passer par un bout de code CSS à mette dans perso.css
Mais je ne vois pas comment faire.
J’ai tenté certains trucs qui ne marchent pas.
Merci de votre aide
Sylvain

et pour quelques lignes de css en plus...
y-forums - le 12 novembre 2019

Il faut que tu passe par un click droit sur le zone concernée une fois qu’elle est sélectionnée et là tu vois le style qu’il faut mettre dans perso.css.
Si tu nous donnais l’url de ton site on pourrais même te dire lequel 😉
Si je fais ça ici, sur actualités, j’ai :

cadre-couleur h1.cadre {
    background-color: #82ADE2;
    color: #000000;
}

Bonne soirée,
Yves

Image de fond sur la noisette edito
Sylvain Le Doaré - le 12 novembre 2019

Bonsoir,
Voilà l’URL : club-interloisirs-conflans.org

Je n’ai pas trouvé ou je n’ai pas compris ce que tu dis !
A+
Sylvain

Mettre un fond dans la noisette
Jean Christophe Villeneuve - le 12 novembre 2019

Ce qu’il tentait  😉 de t’expliquer, c’est qu’avec Firefox, un faisant un click droit sur une zone d’un site puis en cliquant sur "Examiner l’élément" on peut avoir des infos sur les css utilisées, ce qui peut permettre ensuite de cibler cette zone avec des css dans perso.css

Super pratique quand on connaît un peu le html et le css !
On peut même tester des trucs en live.

Mettre un fond dans la noisette
Jean Christophe Villeneuve - le 12 novembre 2019

Hello

Imaginons que ton image de fond s’appelle mon_image.jpg et qu’elle soit dans le dossier /squelettes

Dans perso.css, tu mets ceci

.edito.texte{
	background: url(../images/mon_image.jpg) no-repeat;
	background-size: 100%;
}

Le problème c’est qu’il va être très difficile d’adapter l’image à la hauteur du bloc qui sera variable en fonction du texte qu’il contient.

Image de fond sur la noisette edito
Sylvain Le Doaré - le 12 novembre 2019

Bonsoir,
J’avais bien fait. Le problème c’est que je ne voyais pas comment utiliser les infos obtenues pour les mettre dans perso.css.
Quand je disais que j’avais tenté plusieurs trucs, c’était en partant de l’inspection par Firefox et l’examen des divers fichiers du squelette Escal.
Merci pour ta solution.
Cependant voilà le code que j’ai mis et qui marche bien

.edito.texte{
    background-image: url("../images/mon-image.png") ;
    background-repeat: no-repeat;
    background-size: contain;
}

le no-repeat à la fin de bakground-image ne fonctionne pas.

Merci à tout le monde
Sylvain

Mettre un fond dans la noisette
Jean Christophe Villeneuve - le 12 novembre 2019

Oops, le code proposé fonctione si l’image est dans /squelettes/images

Sorry