﻿<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/"><channel><title>语源科技BlogJava-ChuanQi’s BLOG</title><link>http://www.blogjava.net/chuanqi1415583094/</link><description>chuanqi</description><language>zh-cn</language><lastBuildDate>Sun, 12 Apr 2026 06:08:46 GMT</lastBuildDate><pubDate>Sun, 12 Apr 2026 06:08:46 GMT</pubDate><ttl>60</ttl><item><title>文字特效 </title><link>http://www.blogjava.net/chuanqi1415583094/archive/2012/10/26/390287.html</link><dc:creator>ChuanQi‘s BLOG</dc:creator><author>ChuanQi‘s BLOG</author><pubDate>Fri, 26 Oct 2012 09:45:00 GMT</pubDate><guid>http://www.blogjava.net/chuanqi1415583094/archive/2012/10/26/390287.html</guid><wfw:comment>http://www.blogjava.net/chuanqi1415583094/comments/390287.html</wfw:comment><comments>http://www.blogjava.net/chuanqi1415583094/archive/2012/10/26/390287.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/chuanqi1415583094/comments/commentRss/390287.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/chuanqi1415583094/services/trackbacks/390287.html</trackback:ping><description><![CDATA[&nbsp;&nbsp;&nbsp;我们平常在浏览网页的时候，经常会看到一些显示特效的文字，像这样的特效文字大多数都是利用css<span style="font-family: 宋体">样式来实现的。在这里，我向大家介绍几种文字的特效。</span> 
<h2>1<span style="font-family: 黑体">、文字的发光效果</span></h2>
<p class="p0">&nbsp;&nbsp;&nbsp;&nbsp;主要通过<span style="font-family: Times New Roman">css</span><span style="font-family: 宋体">样式的</span><span style="font-family: Times New Roman">glow</span><span style="font-family: 宋体">滤镜属性实现的，</span><span style="font-family: Times New Roman">filter:glow(color=color_value,Strength=value)</span></p>
<p class="p0">Color:<span style="font-family: 宋体">表示边缘光晕的颜色</span></p>
<p class="p0">Strength<span style="font-family: 宋体">：表示边缘光晕的强度大小，范围在</span><span style="font-family: Times New Roman">1~255</span><span style="font-family: 宋体">之间。</span></p>
<p class="p0">&nbsp;</p>
<p><img alt="" src="http://pic002.cnblogs.com/images/2012/457263/2012102508424643.jpg" /></p>
<p class="p0">代码：<span style="font-family: Times New Roman">css</span><span style="font-family: 宋体">样式</span></p>
<p class="p0">&lt;style&nbsp;type="text/css"&gt;</p>
<p class="p0">.tb{</p>
<p class="p0">font-size:&nbsp;40px;</p>
<p class="p0">filter:glow(color=skyblue,direction=2);</p>
<p class="p0">font-family:&nbsp;华文行楷;</p>
<p class="p0">}</p>
<p class="p0">&lt;/style&gt;</p>
<p class="p0">&nbsp;</p>
<h2>2<span style="font-family: 黑体">、文字的阴影效果</span></h2>
<p class="p0">&nbsp;&nbsp;&nbsp;&nbsp;主要通过<span style="font-family: Times New Roman">css</span><span style="font-family: 宋体">样式的</span><span style="font-family: Times New Roman">dropshadow</span><span style="font-family: 宋体">滤镜属性实现的，</span><span style="font-family: Times New Roman">filter:glow(color=color_value,offx=value,offy=value,positive=value);</span></p>
<p class="p0">Color:<span style="font-family: 宋体">表示阴影的颜色</span></p>
<p class="p0">Offx<span style="font-family: 宋体">：</span><span style="font-family: Times New Roman">x</span><span style="font-family: 宋体">轴方向阴影的偏移量。</span></p>
<p class="p0">Offy<span style="font-family: 宋体">：</span><span style="font-family: Times New Roman">y</span><span style="font-family: 宋体">轴方向阴影的偏移量。</span></p>
<p class="p0">Positove<span style="font-family: 宋体">：取值为</span><span style="font-family: Times New Roman">false</span><span style="font-family: 宋体">或</span><span style="font-family: Times New Roman">true</span><span style="font-family: 宋体">，</span><span style="font-family: Times New Roman">true</span><span style="font-family: 宋体">表示不透明像素建立可见的阴影，</span><span style="font-family: Times New Roman">false</span><span style="font-family: 宋体">表示为透明像素可见阴影。若不写表示为默认，默认为</span><span style="font-family: Times New Roman">true</span><span style="font-family: 宋体">。</span></p>
<p class="p0">&nbsp;</p>
<p><img alt="" src="http://pic002.cnblogs.com/images/2012/457263/2012102508431049.jpg" /></p>
<p class="p0">代码：<span style="font-family: Times New Roman">css</span><span style="font-family: 宋体">样式</span></p>
<p class="p0">.tb1{</p>
<p class="p0">font-size:&nbsp;40px;</p>
<p class="p0">filter:dropshadow(color=green,offx=3,offy=3);</p>
<p class="p0">font-family:&nbsp;华文隶书;</p>
<p class="p0">}</p>
<h2>3<span style="font-family: 黑体">、文字的渐变阴影效果</span></h2>
<p class="p0">&nbsp;&nbsp;&nbsp;&nbsp;主要通过<span style="font-family: Times New Roman">css</span><span style="font-family: 宋体">样式的</span><span style="font-family: Times New Roman">shadow</span><span style="font-family: 宋体">滤镜属性实现的，</span><span style="font-family: Times New Roman">filter:glow(color=color_value,direction=value);</span></p>
<p class="p0">Color<span style="font-family: 宋体">：阴影的颜色。</span></p>
<p class="p0">Direction<span style="font-family: 宋体">：设定渐变阴影的方向，渐变阴影是按照顺时针方向进行的，</span><span style="font-family: Times New Roman">0</span><span style="font-family: 宋体">&#186;表示垂直向上，之后每</span><span style="font-family: Times New Roman">45</span><span style="font-family: 宋体">&#186;为一个单位，默认值为</span><span style="font-family: Times New Roman">270</span><span style="font-family: 宋体">&#186;。</span></p>
<p class="p0">&nbsp;<img alt="" src="http://pic002.cnblogs.com/images/2012/457263/2012102508433632.jpg" /></p>
<p class="p0">.tb2{</p>
<p class="p0">font-size:&nbsp;40px;</p>
<p class="p0">filter:shadow(color=skyblue,direction=135);</p>
<p class="p0">font-family:&nbsp;黑体;</p>
<p class="p0">}</p>
<h2>4<span style="font-family: 黑体">、文字的图案填充效果</span></h2>
<p class="p0">&nbsp;&nbsp;&nbsp;&nbsp;主要通过<span style="font-family: Courier New">dropshadow</span><span style="font-family: 宋体">和</span><span style="font-family: Courier New">chroma</span><span style="font-family: 宋体">滤镜相结合来实现。</span><span style="font-family: Courier New">Chroma</span><span style="font-family: 宋体">样式</span></p>
<p class="p0">Filter:chroma(color=color_value);</p>
<p class="p0">Color:<span style="font-family: 宋体">透明的颜色，如</span><span style="font-family: Courier New">color</span><span style="font-family: 宋体">为</span><span style="font-family: Courier New">#ffcc00</span><span style="font-family: 宋体">，则滤镜作用范围内的所有为</span><span style="font-family: Courier New">#ffcc00</span><span style="font-family: 宋体">的颜色都将变为透明，包括图片的像素。</span></p>
<p class="p0">&nbsp;</p>
<p><img alt="" src="http://pic002.cnblogs.com/images/2012/457263/2012102508441561.jpg" /></p>
<p class="p0">&lt;div&nbsp;style="background-image:&nbsp;url(ahcme.jpg);width:&nbsp;100%"&gt;</p>
<p class="p0">&lt;div&nbsp;style="filter:chroma(color=#cccccc)dropshadow(color=#777777,offx=-1,offy=-1,positive=2);</p>
<p class="p0">color:#cccccc;background-color:&nbsp;#ffffff;width:&nbsp;100%;font:&nbsp;bold&nbsp;50pt&nbsp;黑体;"&nbsp;&gt;</p>
<p class="p0">文字的图案填充效果</p>
<p class="p0">&lt;/div&gt;</p>
<p class="p0">&nbsp;</p>
<h2>5<span style="font-family: 黑体">、文字的探照灯效果</span></h2>
<p class="p0">&nbsp;&nbsp;&nbsp;&nbsp;主要通过<span style="font-family: Courier New">light</span><span style="font-family: 宋体">滤镜相结合来实现。</span><span style="font-family: Courier New">Chroma</span><span style="font-family: 宋体">样式</span></p>
<p class="p0">filter:light;</p>
<p class="p0">在<span style="font-family: Courier New">javascript</span><span style="font-family: 宋体">中，可以使用</span><span style="font-family: Courier New">document</span><span style="font-family: 宋体">对象来获得元素的</span><span style="font-family: Courier New">light</span><span style="font-family: 宋体">滤镜对象，然后通过调用</span><span style="font-family: Courier New">light</span><span style="font-family: 宋体">滤镜对象中的方法来实现文字的发光效果，</span><span style="font-family: Courier New">light</span><span style="font-family: 宋体; font-size: 14px">滤镜中包含的方法如下：</span></p>
<table style="margin-left: auto; margin-right: auto">
<tbody>
<tr>
<td valign="top" width="284">
<p class="p0"><strong><span style="font-size: 14px">方法</span></strong></p></td>
<td valign="top" width="284">
<p class="p0"><strong><span style="font-size: 14px">说明</span></strong></p></td></tr>
<tr>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">addAmbient</span></p></td>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">加入包围的光源</span></p></td></tr>
<tr>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">addCone</span></p></td>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">加入锥形光源</span></p></td></tr>
<tr>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">addPoint</span></p></td>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">加入点光源</span></p></td></tr>
<tr>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">changcolor</span></p></td>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">改变光的颜色</span></p></td></tr>
<tr>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">changstrength</span></p></td>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">改变光源的强度</span></p></td></tr>
<tr>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">clear</span></p></td>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">清除所有的光源</span></p></td></tr>
<tr>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">moveLight</span></p></td>
<td valign="top" width="284">
<p class="p0"><span style="font-size: 14px">移动光源</span></p></td></tr></tbody></table>
<p style="text-align: center" class="p0">&nbsp;</p>
<p class="p0">&nbsp;&nbsp;&nbsp;&nbsp;还有关于其他的各种问题特效，等有时间整理出来之后再奉献给各位！</p><img src ="http://www.blogjava.net/chuanqi1415583094/aggbug/390287.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/chuanqi1415583094/" target="_blank">ChuanQi‘s BLOG</a> 2012-10-26 17:45 <a href="http://www.blogjava.net/chuanqi1415583094/archive/2012/10/26/390287.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>设置自定义的鼠标形状</title><link>http://www.blogjava.net/chuanqi1415583094/archive/2012/10/24/390133.html</link><dc:creator>ChuanQi‘s BLOG</dc:creator><author>ChuanQi‘s BLOG</author><pubDate>Wed, 24 Oct 2012 00:32:00 GMT</pubDate><guid>http://www.blogjava.net/chuanqi1415583094/archive/2012/10/24/390133.html</guid><wfw:comment>http://www.blogjava.net/chuanqi1415583094/comments/390133.html</wfw:comment><comments>http://www.blogjava.net/chuanqi1415583094/archive/2012/10/24/390133.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/chuanqi1415583094/comments/commentRss/390133.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/chuanqi1415583094/services/trackbacks/390133.html</trackback:ping><description><![CDATA[&nbsp;&nbsp;&nbsp;&nbsp; 摘要:     在我们进行网页的设计中，我们会经常的用到鼠标的各种形状，鼠标形状的改变主要是在css文件中实现的。我们可以在css中设置cursor的属性值来实现不同的鼠标指针形状，cursor的不同属性值对应着相应的鼠标形状，下面是我整理的一些鼠标形状和cursor属性值：<br><br>&nbsp;&nbsp;<a href='http://www.blogjava.net/chuanqi1415583094/archive/2012/10/24/390133.html'>阅读全文</a><img src ="http://www.blogjava.net/chuanqi1415583094/aggbug/390133.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/chuanqi1415583094/" target="_blank">ChuanQi‘s BLOG</a> 2012-10-24 08:32 <a href="http://www.blogjava.net/chuanqi1415583094/archive/2012/10/24/390133.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>