|
|
图片的变形
名称： |
图片的变形 |
实例：
|
这是wave-filtered 效果(扭曲)
这是 alpha效果. (透明度)
这是 blur 效果. (模糊)
这是 chroma 效果(色度)
这是 flipV 效果(翻转) |
教程： |
将以下代码加入html的<head>和</head>之间： <style>
div {height:100;width:400;font-size:17pt}
</style>
将以下代码加入<body>和</body>之间
<div
style="filter:wave(add=0,freq=1,lightStrength=20,phase=50,strength=20)"><p
align="center"><img src="Family.jpg" WIDTH="160"
HEIGHT="103"> </p>
</div><p>这是wave-filtered 效果(扭曲)</p>
<div
style="filter:alpha(opacity=10,finishOpacity=10,style=10,startX=10,startY=10,finishX=20,finishY=30,add=0,direction=45,strength=10)"><p
align="center"><img src="Family.jpg" WIDTH="160"
HEIGHT="103"> </p>
</div><p>这是 alpha效果. (透明度)</p>
<div style="filter:blur(add=0,direction=45,strength=5)"><p
align="center"><img src="Family.jpg" WIDTH="160"
HEIGHT="103"> </p>
</div><p>这是 blur 效果. (模糊)</p>
<div style="filter:chroma(color=white)"><p
align="center"><img src="Family.jpg" WIDTH="160"
HEIGHT="103"> </p>
</div><p>这是 chroma 效果(色度)</p>
<div style="filter:flipV"><p align="center"><img
src="Family.jpg" WIDTH="160" HEIGHT="103"> </p>
</div><p>这是 flipV 效果(翻转)
|
说明： |
你可以单独使用某一种效果 |
|
