Mettre une opacity sur un background-image

Résolu

Anouchka2586 Messages postés 50 Date d'inscription Statut Membre Dernière intervention -
Anouchka2586 Messages postés 50 Date d'inscription Statut Membre Dernière intervention - 11 juil. 2018 à 15:45

Bonjour,

Svp comment mettre une couleur en opacity sur un background ?
J'ai par exemple :

 <!-- Section 1 -->
   <section class="section_one">
   </section>

et le syle.css:

.section_one{
  background-image: url('img/post-bg.jpg');
}

J'aimerais mettre une couleur bleue en opacity de 0.3 par exemple. Comment puis-je le faire ?
Merci

Afficher la suite

A voir également:

Opacity background image
Opacity on background image - Meilleures réponses
Background opacity css - Meilleures réponses
Supprimez les composantes rouge et verte de cette image. quel mot apparaît ? - Forum Word
Image iso - Guide
Acronis true image - Télécharger - Sauvegarde
Reduire taille image - Guide
Légender une image - Guide

5 réponses

Réponse 1 / 5

Anouchka2586 Messages postés 50 Date d'inscription Statut Membre Dernière intervention 5

J'ai fait ceci et ça ne change rien:

.section_one{
  background-image: url('img/post-bg.jpg');
  background-color: rgba(0,0,255,0.3) 
  border: 3px solid red;
}

Réponse 2 / 5

Anouchka2586 Messages postés 50 Date d'inscription Statut Membre Dernière intervention 5

Svp quelqu'un peut-il m'aider ? Merci

nulenmathe Messages postés 425 Date d'inscription Statut Membre Dernière intervention 152

Réponse 5 / 5

nulenmathe Messages postés 425 Date d'inscription Statut Membre Dernière intervention 152

il faut

<p class=parent>
<p class=enfant>
</p>
</p>

Tu met le couleur sur le parent et l'image sur l'enfant

Anouchka2586 Messages postés 50 Date d'inscription Statut Membre Dernière intervention 5

ça ne marche pas. j'ai essai comme ceci mais ien n'y est fait:

<div class="row parent" style="background-color:red; opacity: 0.1;">
       <div class="enfant" style="background-image: url('img/bloc1.png'); background-repeat: no-repeat; background-size: 100% auto; height: 598px;">
      </div>
    </div>

Voici le rendu et l'image n'apparait pas :

Discussions similaires

faire un menu horizontale

Comment coder la taille des boutons coté html ?

probleme CSS ne s'applique pas

Diaporama HTML CSS

Faire un cv en html css

Remplacer une image par une autre uniquement avec le CSS

Votre réponse

Discussions similaires