Is there any way to opacity only background of a text in css?

Question

Is there a way to opacity only background-color of a text in css?(not text color...just background-color of The text)....I do not want use image background.

This is an example:

enter link description here

background is opacity but the text is opacity too...I do not want it...

score 5 · Accepted Answer · answered Mar 05 '14 at 21:21

5

Sure, use rgba():

div ul li a.title {
    padding: 0px 12px 0 0px;
    background:rgba(255,0,0,.2);
}

jsFiddle example

answered Mar 05 '14 at 21:21

j08691

204,283
31
260
272

score 3 · Answer 2 · edited Mar 05 '14 at 21:23

3

Use background: rgba(255, 0, 0, .2);

http://fiddle.jshell.net/wLmAC/1/

edited Mar 05 '14 at 21:23

Jatin

3,065
6
28
42

answered Mar 05 '14 at 21:21

apohl

1,913
27
30

score 2 · Answer 3 · answered Mar 05 '14 at 21:23

2

Use rgba() to get that transparent background you need, like this:

background: rgba(255,0,0,0.5);

answered Mar 05 '14 at 21:23

ntzm

4,663
2
31
35

Is there any way to opacity only background of a text in css?

3 Answers3