25 août 2010

(OverBlog) Encadrer les photos avec des textures

Il faut un peu tricher. En fait, il faut mettre une texture en background de l'image et ensuite fixer des marges autour de l'image pour donner un semblant de cadre.

Vous allez dans le CSS - Design > Mode CSS et vous complétez la ligne qui existe déjà

img {background-image:url(adresse de l'image);padding:10px;
Padding :10 px représente une marge de 10 px autour de l'image et donc l'épaisseur de l'encadrement. Vous pouvez jouer avec le nombre de px

7 commentaires:

  1. Bonjour et merci pour ton blog qui est d’une aide précieuse.
    J’utilise le design easyblog sur overblog et les images insérées sont systématiquement entourées d’un cadre gris. Je souhaiterais enlever ce cadre mais je n’y arrive pas.
    Pourrais-tu m’indiquer comment faire.
    Merci d’avance.

    RépondreSupprimer
  2. Bonjour S :)
    Dans le CSS, il faut que tu remplaces
    .contenuArticle img {
    border-style: solid;
    border-width: 1px;
    padding: 3px;
    background-color: #494949;
    border-color: #3A3A3A;
    }
    par
    .contenuArticle img {
    border-style: solid;
    border-width: 0px;
    padding: 3px;
    background-color: transparent;
    border-color: #3A3A3A;
    }
    Cette ligne concerne les images des articles.

    RépondreSupprimer
  3. Bonjour,

    j'aimerais moi aussi enlever les bordures grises autour des images que j'insère. J'ai fait tout ce qui est indiqué mais ça ne marche pas.

    Comment faire?
    Merci d'avance.

    RépondreSupprimer
  4. Bonjour Kirsten :)
    Je ne vois pas de bordures autour de tes images (exemple : http://bienvenusaupaysdelarcenciel.over-blog.com/article-tout-est-dans-la-configuration-58766324.html)
    et j'ai vérifié ton CSS, il est bon :
    .contenuArticle img {border-style: solid;
    border-width: 0px;padding: 3px;background-color: transparent;border-color: #3A3A3A;}
    Tu as un exemple concret à me montrer ?

    RépondreSupprimer
  5. Bonjour,

    en fait, je crois que j'ai été trop pressée...Hier soir,ça n'avait pas l'air d'avoir fonctionné, mais aujourd'hui, les images ne sont plus encadrées... C'était le temps que tout se mette en place!
    Désolée...

    Merci beaucoup pour toutes vos marches à suivre qui facilitent grandement la vie et qui permettent d'y voir plus clair (!).

    Kirsten

    RépondreSupprimer
  6. Un grand merci pour l'explication au précédent commentaire, j'avais le même problème!

    RépondreSupprimer

1/ Choisissez Nom/URL comme profil pour poster, si vous hésitez
2/ Si vous désirez une aide personnalisée, pensez à laisser l'adresse de votre blog, ce qui me permettra de tester.
3/ Vous pouvez vous abonner par email pour suivre les réponses de cet article (lien sous la zone de rédaction du commentaire)