DIV background translucent text opaque style_HTML/Xhtml_Web page production

WBOY
Release: 2016-05-16 16:39:12
Original
1606 people have browsed it

The DIV background is semi-transparent and the text in the DIV is not translucent

Copy the code
The code is as follows:




The layer background is semi-transparent, and the font color is also semi-transparent

Copy code
The code is as follows:


The layer background is semi-transparent and the font color is not translucent


******The layer with filter must have the width attribute, otherwise the filter will be invalid. ********

We can use CSS style filter (filter effect) to set filter effects on some HTML tags.

Example:

Black and white photo filter: gray;
X-ray photo filter: Xray;
Wind blur filter: blur(add=true, direction=45,strength=30);
Sine wave filter: Wave(Add=0, Freq=60, LightStrength=1, Phase=0, Strength=3);
Translucent effect filter: Alpha(Opacity =50);
Linear transparency filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=140);
Radial transparency filter: Alpha(Opacity=10, FinishOpacity=100, Style=2, StartX=30, StartY=30, FinishX=200, FinishY=200);
White transparent filter: Chroma(Color=#FFFFFF);
Reduce Color filter: grays;
Negative effect filter: invert;
Left and right flip filter: fliph;
Vertical flip filter: flipv;
Projection effect filter:progid:dXImageTransform.Microsoft.DropShadow(color=# cccccc,offX=5,offY=5,positives=true);
Mosaic filter:progid:dXImageTransform.Microsoft.Pixelate(maxsquare=3);
Glow effect filter:progid:dXImageTransform.Microsoft.Glow(color =#cccccc,Strength=5);
Soft edge effect filter:alpha(opacity=100, finishOpacity=0,style=2
Related labels:
div
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!