css background transparent opaque text

If the background is a single color, transparent property can not css (i.e., Opacity), but the use of a transparent color (using rgba function), such as:

<Div style = "background-color: rgba (255,255,255,0.5)"> red background transparency of 0.5, opaque text </ div>

If the background is a picture, you can make the background and text are two brotherly relations (rather than parent-child relationship) layer, and then made transparent background layer, then the text layer overlaid on the background layer can be, for example:

<div style = "position: relative"> 
    <div style = "position: Absolute; background: URL (Image URL it ourselves) NO-REPEAT; height: 40px; width: 300px by; Opacity: 0.5"> </ div> 
    < div style = "position: absolute" > 0.5 transparency background image, text opaque </ div> 
</ div>

 

Guess you like

Origin www.cnblogs.com/dingboyang/p/10991034.html