2017-01-20 3 views
-2

D'accord, je ne peux pas penser à un moyen de le faire mais sur My Blogger derrière le poste est un fond brun brunâtre et je ne peux pas changer l'opacité, je peux faire une couleur unie, mais ne change pas l'opacité. Je me demande s'il existe une solution de contournement CSS pour cela. ou toute autre solution de contournement pour rendre l'opacité moins visible, de sorte que le texte ne se heurte pas si fort avec le liquide sombre dans le verre de vin.Blogger Post Background Opacité

Toute aide est génial, merci Maxthespy

+0

Vous recherchez rgba. Mais: s'il vous plaît poster un [mcve] –

Répondre

1

Qu'est-ce que vous cherchez est opacity: 0.5;. Notez que vous aurez également besoin d'filter: alpha(opacity=50); pour faire face à ces versions IE satanés début;)

EDIT:

Changer l'opacité changera l'opacité totale de la div, y compris son contenu texte. Pour utiliser à la fois un background-url transparent et du texte en dur, vous aurez besoin d'un peu de hack CSS pour utiliser réellement l'image d'arrière-plan dans le :after de , et le configurer pour apparaître au même endroit en arrière-plan:

.post-outer { 
    display: block; 
    position: relative; 
    padding: 15px 20px; 
    margin: 0 0 25px; 
    border: dotted 1px #ccb299; 
    box-shadow: 0 0 0 rgba(0, 0, 0, .1); 
} 

.post-outer::after { 
    content: ""; 
    background: url(https://resources.blogblog.com/blogblog/data/1kt/watermark/post_background_birds.png); 
    opacity: 0.5; 
    filter: alpha(opacity=50); /* For IE8 and earlier */ 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
    position: absolute; 
    z-index: -1; 
} 

Espérons que cela aide!

+0

J'ai donné un aller et il semble que j'ai besoin de l'arrière-plan de la poste pour être moins voir à travers. Je dois à peine pouvoir voir le verre à vin –

+0

Vous pouvez ajuster le niveau de transparence en changeant la valeur 'opacity'. 'opacité: 0.5;' signifie 50% d'opacité. Si vous le voulez presque invisible, vous pouvez le faire descendre à quelque chose comme 'opacity: 0.1;' (10% de visibilité). N'oubliez pas de changer le filtre pour gérer les premiers navigateurs IE. Dans ce cas ce serait 'filter: alpha (opacité = 10)' :) –

+0

Je suis allé tout le chemin à 1.0 et il n'était pas assez sombre, j'ai changé la couleur RVB à: opacité: rgba (195,136,39,0.5); Cela fonctionne bien, je pense que ça pourrait être un peu plus sombre mais c'est beaucoup plus lisible. –

0

Remplacer cette ligne pour .post-outer

background: rgba(0, 0, 0, 0) url(https://resources.blogblog.com/blogblog/data/1kt/watermark/post_background_birds.png) repeat scroll top left` 

Avec une couleur de fond RGBA, où les 3 premières valeurs sont la valeur RVB pour la couleur que vous voulez utiliser, et la dernière valeur est la valeur d'opacité. C'est "blanc" (255,255,255) avec 90% d'opacité.

background: rgba(255,255,255,0.9); 
+0

qui a fait quelque chose mais pas ce que je voulais, je voulais que l'opacité de cette même couleur soit plus sombre. –

+0

@CrowEcho L'image qu'ils utilisent comme arrière-plan est un png blanc avec transparence alpha. C'est exactement la même chose que je vous ai donnée, sauf que je ne sais pas quelle est leur valeur de transparence/opacité. Je ne suis pas sûr de ce que vous voulez dire par "l'opacité de cette même couleur pour être plus sombre". L'opacité n'est pas claire ou sombre. Essayez de changer le "0.9" dans la chose que je vous ai donné à "0.5" ou "0.3". Si vous recherchez une couleur foncée, pas une légère, vous pouvez utiliser le noir en utilisant 'rgba (0,0,0,0.5)' où "0.5" est la valeur d'opacité, que vous pouvez changer à 0.1 (10 % visible), 0.2 (20%), 0.3 (30%), etc. –

+0

Cela a fonctionné un peu mieux mais je pense toujours que l'arrière-plan pourrait être plus sombre, j'ai ajouté un brun foncé et ça n'a pas l'air d'énerver. Je vais essayer de trouver un sweet spot entre la couleur et l'opacité –