Transparence du bandeau

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • Transparence du bandeau

    Bonjour à toutes et à tous,
    Je rappelle que je suis plutôt débutant sur Joomla, et sur tout ce qui est graphisme et internet.
    J'ai réussi (grace aux "Joomlistes" chevronnés de ce forum, que je remercie au passage) à mettre un fond à ma page d'accueil, sauf la partie bandeau, entourée en rouge dans l'image ci-dessous (les parties blanches de l'image sont normalement transparentes, le fichier étant en PNG).

    Cliquez sur l'image pour l'afficher en taille normale

Nom : bandeau.jpg 
Affichages : 1 
Taille : 36,9 Ko 
ID : 1824877

    Je me suis "tapé" quelques tutos sur le CSS et HTML, le plugin firebug de FireFox et Chrome, et j'ai fait de nombreux essais, mais là je coince.

    Si quelqu'un(e) d'entre vous pouvait me dire comment faire, je l'en remercie d'avance.
    Si ca peut aider, mon site est (provisoirement) à l'URL http://dlicdl.free.fr/

    Mika

  • #2
    Re : Transparence du bandeau

    Bonjour,
    (les parties blanches de l'image sont normalement transparentes, le fichier étant en PNG).
    ton image du bandeau est un fichier jpg ... pas un fichier png


    Donc, pour rendre cette image transparente, il te faut la refaire dans un logiciel de retouche d'image genre Gimp (gratuit et open source) ... il y a pas mal de tuto sur le sujet si tu fais des recherches sur Google

    Voila ce que j'ai reussi a faire vite fait et très grossièrement avec ce logiciel sur ton image
    Cliquez sur l'image pour l'afficher en taille normale

Nom : banner_08.jpg 
Affichages : 1 
Taille : 15,1 Ko 
ID : 1806386
    Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer
    Cette année, le JoomlaDay FR a lieu à Bruxelles, les 20 et 21 mai 2022, plus d'infos et inscriptions : www.joomladay.fr

    Commentaire


    • #3
      Re : Transparence du bandeau

      Merci Manu93fr,

      Effectivement, mon image en ligne était un jpg (Mais sur mon site en local, c'était bien en PNG), mais même avec du PNG, ca ne donne pas de meilleurs résultats.
      D'ailleurs, je viens de de mettre mon site (http://dlicdl.free.fr/) à jour avec l'image en PNG, et on n'a toujours pas la transparence.

      Merci quand même

      Mika

      Commentaire


      • #4
        Re : Transparence du bandeau

        Bonsoir,
        ton image est bien transparente maintenant, mais comme je te le disais un peu plus haut, elle est incluse dans 4/5 <div> (des boites) qui elles ne le sont pas
        Pour t'en convraicre, clique sur ton 2eme liens ... et tu verras que ton image est sur fond blanc car le background de la <div> est un fond blanc

        Avec l'inspecteur de code (F12) j'ai pu simuler une suppression des background et ça donne ça

        Cliquez sur l'image pour l'afficher en taille normale

Nom : capture.jpg 
Affichages : 1 
Taille : 134,3 Ko 
ID : 1806390
        Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer
        Cette année, le JoomlaDay FR a lieu à Bruxelles, les 20 et 21 mai 2022, plus d'infos et inscriptions : www.joomladay.fr

        Commentaire


        • #5
          Re : Transparence du bandeau

          Merci manu93fr,

          Je vais essayer de corriger ça. Je dois bien reconnaître que ma connaissance du CSS, malgré mes efforts d'apprentissage, reste assez limitée, et surtout très théorique.

          Mika

          Commentaire


          • #6
            Re : Transparence du bandeau

            header, .header-inner, .brand, .header-search {background: transparent !important;}

            a mettre en bas du fichier user.css.....

            Commentaire


            • #7
              Re : Transparence du bandeau

              Merci lefabdu51,

              En fait, j'étais bon sur les différentes couches, sauf que j'avais utilisé (par copier/coller) une formule que je ne comprenais pas très bien :
              Code:
              background: rgba(232, 232, 232, 0.62)!important;
              En la modifiant comme suit :
              Code:
              background: rgba(232, 232, 232, 0.0)!important;
              Ca va tout de suite mieux.

              Mika

              Commentaire

              Annonce

              Réduire
              Aucune annonce pour le moment.

              Partenaire de l'association

              Réduire

              Hébergeur Web PlanetHoster
              Travaille ...
              X