html5中文学习网

您的位置: 首页 > 网页制作 > html教程 » 正文

DIV背景半透明文字不半透明的样式_HTML/Xhtml_网页制作

[ ] 已经帮助:人解决问题
点评:DIV背景半透明,DIV中的字不半透明如何实现,下面有个不错的示例,感兴趣的朋友可以了解下
DIV背景半透明,DIV中的字不半透明 tKcHTML5中文学习网 - HTML5先行者学习网

复制代码
代码如下:
tKcHTML5中文学习网 - HTML5先行者学习网
<body bgcolor="#336699"> tKcHTML5中文学习网 - HTML5先行者学习网
<div style="filter:alpha(opacity=50);background:#ffffff;width:600;"><span style="color:yellow"> tKcHTML5中文学习网 - HTML5先行者学习网
tKcHTML5中文学习网 - HTML5先行者学习网
图层背景半透明,字体颜色也半透明 tKcHTML5中文学习网 - HTML5先行者学习网

复制代码
代码如下:
tKcHTML5中文学习网 - HTML5先行者学习网
</span></div> tKcHTML5中文学习网 - HTML5先行者学习网
<div style="filter:alpha(opacity=50);background:#ffffff;width:600"><span style="position:relative;color:yellow">图层背景半透明,字体颜色不半透明</span></div> tKcHTML5中文学习网 - HTML5先行者学习网
tKcHTML5中文学习网 - HTML5先行者学习网
*******带filter的层一定要有width属性,否则filter无效。******** tKcHTML5中文学习网 - HTML5先行者学习网
tKcHTML5中文学习网 - HTML5先行者学习网
我们可以用CSS样式的filter(滤镜效果)对HTML的一些标记设置滤镜效果。 tKcHTML5中文学习网 - HTML5先行者学习网
tKcHTML5中文学习网 - HTML5先行者学习网
例: tKcHTML5中文学习网 - HTML5先行者学习网
tKcHTML5中文学习网 - HTML5先行者学习网
黑白照片 filter: gray; tKcHTML5中文学习网 - HTML5先行者学习网
X光照片 filter: Xray; tKcHTML5中文学习网 - HTML5先行者学习网
风动模糊 filter: blur(add=true,direction=45,strength=30); tKcHTML5中文学习网 - HTML5先行者学习网
正弦波纹 filter: Wave(Add=0, Freq=60, LightStrength=1, Phase=0, Strength=3); tKcHTML5中文学习网 - HTML5先行者学习网
半透明效果 filter: Alpha(Opacity=50); tKcHTML5中文学习网 - HTML5先行者学习网
线型透明 filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=140); tKcHTML5中文学习网 - HTML5先行者学习网
放射透明 filter: Alpha(Opacity=10, FinishOpacity=100, Style=2, StartX=30, StartY=30, FinishX=200, FinishY=200); tKcHTML5中文学习网 - HTML5先行者学习网
白色透明 filter: Chroma(Color=#FFFFFF); tKcHTML5中文学习网 - HTML5先行者学习网
降低色彩 filter: grays; tKcHTML5中文学习网 - HTML5先行者学习网
底片效果 filter: invert; tKcHTML5中文学习网 - HTML5先行者学习网
左右翻转 filter: fliph; tKcHTML5中文学习网 - HTML5先行者学习网
垂直翻转 filter: flipv; tKcHTML5中文学习网 - HTML5先行者学习网
投影效果 filter:progid:dXImageTransform.Microsoft.DropShadow(color=#cccccc,offX=5,offY=5,positives=true); tKcHTML5中文学习网 - HTML5先行者学习网
马赛克 filter:progid:dXImageTransform.Microsoft.Pixelate(maxsquare=3); tKcHTML5中文学习网 - HTML5先行者学习网
发光效果 filter:progid:dXImageTransform.Microsoft.Glow(color=#cccccc,Strength=5); tKcHTML5中文学习网 - HTML5先行者学习网
柔边效果 filter:alpha(opacity=100, finishOpacity=0,style=2
(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助