|
|
水波纹文字（滤镜filter:wave）
吉祥如意988/编辑 |
| 一、简介 |
|
水波纹特效文字效果其实就是运用了滤镜filter 属性之一滤镜filter:wave（把元素呈现为波浪状）。
滤镜filter:wave水波纹属性
filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5)
Add：一般为1，或0。
Freq：变形值。
LightStrength：变形百分比。
Phase：角度变形百分比。
Strength：变形强度。
更多运用在图片的水波纹比较实用。
相关更多滤镜属性点击参阅：滤镜filter 属性 |
| 二、HTML相关术语 |
|
TABLE 标签是一个容器标记：<table>…</table>
P 标签定义段落容器标记：<p>…</p>
DIV标签严格的组织容器标记：<div>…</div>
size 属性定义的是以像素为单位的输入字段宽度。
font 规定文本的字体、字体尺寸、字体颜色。<font>…</font>
font-size 属性可设置字体的尺寸。该属性设置元素的字体大小。注意，实际上它设置的是字体中字符框的高度；实际的字符字形可能比这些框高或矮（通常会矮）。
color颜色值。 |
| 三、基本代码 |
|
TABLE 标签基本代码：
<TABLE style="filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5)"><TR><TD><FONT color=颜色值 size=字体大小值>水波纹文字效果</FONT></TD></TR></table>
P标签基本代码：
<P style="FONT-SIZE: 字体大小值pt; filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5); WIDTH:文本框宽度px; COLOR:颜色值; HEIGHT:文本框高度px" FONT>水波纹文字效果</FONT></P>
DIV 标签基本代码：
<div style="filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5); width:文本框宽度px; color:颜色值; height=文本框高度px;"><font size=字体大小值>水波纹文字效果</font></div>
|
| 四、设置代码参数说明 |
|
字体颜色值:
color=#< xmlnamespace prefix ="st1" ns ="urn:schemas-microsoft-com:office:smarttags" />4a7ac9
字体文本框大小值：
在TABLE 标签、DIV标签内相同size=5（在DIV标签内HEIGHT: 35px设置了文本框的高度、设置了文本框宽度WIDTH: 216px）
在P 标签内font-size:18pt （实际设置了字体中字符框的高度）、设置文本框的高度HEIGHT:20pt、设置了文本框宽度WIDTH:216px
Add：一般为1，或0。
代码如下：
TABLE 标签代码：
<TABLE style="filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5)"><TR><TD><FONT color=#4a7ac9 size=5>水波纹文字效果</FONT></TD></TR></table>
P 标签代码：
<P style="FONT-SIZE: 18pt; filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5); WIDTH:216px; COLOR:#4a7ac9; HEIGHT:20px" FONT>水波纹文字效果</FONT></P>
DIV 标签代码：
<DIV style="filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5); WIDTH:216px; COLOR:#4a7ac9; HEIGHT:35px"><FONT size=5>水波纹文字效果</FONT></DIV> |
| 五、代码演示示例 |
|
当add=true或1时
TABLE 标签代码：
<TABLE style="filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5)"><TR><TD><FONT color=#4a7ac9 size=5>水波纹文字效果</FONT></TD></TR></table>
P标签代码：
<P style="FONT-SIZE: 18pt; filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5); WIDTH:216px; COLOR:#4a7ac9; HEIGHT:20px" FONT>水波纹文字效果</FONT></P>
水波纹文字效果
DIV标签代码：
<DIV style="filter:wave(add=true,freq=1,lightstrength=3,phase=0,strength=5); WIDTH:216px; COLOR:#4a7ac9; HEIGHT:35px"><FONT size=5>水波纹文字效果</FONT></DIV>
水波纹文字效果
当add=0时
TABLE标签代码：
<TABLE style="filter:wave(add=0,freq=1,lightstrength=3,phase=0,strength=5)"><TR><TD><FONT color=#4a7ac9 size=5>水波纹文字效果</FONT></TD></TR></table>
P标签代码：
<P style="FONT-SIZE: 18pt; filter:wave(add=0,freq=1,lightstrength=3,phase=0,strength=5); WIDTH:216px; COLOR:#4a7ac9; HEIGHT:20px" FONT>水波纹文字效果</FONT></P>
水波纹文字效果
DIV标签代码：
<DIV style="filter:wave(add=0,freq=1,lightstrength=3,phase=0,strength=5); WIDTH:216px; COLOR:#4a7ac9; HEIGHT:35px"><FONT size=5>水波纹文字效果</FONT></DIV>
水波纹文字效果 |
| |
|
