一个人在线视频免费观看www ,亚洲久悠悠色悠在线播放,99精品国产成人一区二区

2. 此濾鏡在應(yīng)用動感模糊的同時(shí)本身也被模糊了，相對于挖自己身上的肉填飽自己饑餓的肚子。這種實(shí)現(xiàn)效果顯然是會大打折扣的，看看正經(jīng)八百text-shadow屬性下的白色投影效果（圖片截自chrome瀏覽器）：

IE下實(shí)現(xiàn)類似CSS3 text-shadow文字陰影的幾種方法

正所謂人比人，氣死人啊。兩者的效果差距可以趕上鳳姐和志玲姐的差距了。然而，通過某些小手段，我們也可以讓MotionBlur濾鏡下的文字陰影效果爺變得很贊，這就是下面一節(jié)的內(nèi)容。
四、MotionBlur濾鏡下文字陰影效果進(jìn)一步優(yōu)化
路上有坑怎么辦？很簡單，填上就好，如果沒有實(shí)物填充，蓋個(gè)蓋子什么的也是好的。所以，正如上面說到，文字應(yīng)用動感濾鏡實(shí)現(xiàn)投影效果好比割肉補(bǔ)瘡，現(xiàn)在，我們只要在被割掉的那塊肉上再補(bǔ)上一塊不就OK了嗎？

您可以狠狠地點(diǎn)擊這里：MotionBlur濾鏡下文字陰影效果優(yōu)化demo

結(jié)果在IE9瀏覽器的兼容模式下（貌似是IE7 的核）的效果如下圖：

效果看上去要舒服多了。效果實(shí)現(xiàn)的原理是兩端一模一樣的文字相互重疊，背后的文字動感模糊，前面的文字就是很純潔的文字了。
CSS代碼如下：

復(fù)制代碼代碼如下:
.bg{width:512px; height:340px; margin:1em auto; background:url(http://image.zhangxinxu.com/image/study/s/s512/mm19.jpg);}
.font{margin:0; padding:1em; font-size:36px; font-family:"微軟雅黑";}
.text{color:#fff; position:absolute;}
.sh{color:#000; text-shadow:1px 1px 5px #000; filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=5, direction=145); *zoom:1;}

HTML代碼如下：

復(fù)制代碼代碼如下:
div class="bg"
h4 class="font"span class="text"張小姐長大了！/spandiv class="sh"張小姐長大了！/div/h4
/div

考慮到不同IE瀏覽器下的兼容性問題，作為陰影效果的文字標(biāo)簽需要使用block水平的標(biāo)簽，且需要在IE6/IE7瀏覽器下haslayout 。另外，這里的文字重疊是借助了absolute絕對定位元素的無高度性和無寬度性實(shí)現(xiàn)的。具體可參見我之前的CSS 相對/絕對(relative/absolute)定位系列（二）以及相關(guān)系列的文章。

不足
由于要借助于兩段不同的文字實(shí)現(xiàn)效果，所以，此方法不使用與長篇大論文字處的投影效果實(shí)現(xiàn) ，像是標(biāo)題啊，導(dǎo)航啊這些文字不是很多的地方就可以使用使用。
五、遠(yuǎn)離text-shadow和濾鏡的文字陰影實(shí)現(xiàn)
這里實(shí)現(xiàn)的原理的精髓其實(shí)跟上面的其實(shí)一致，兩段一模一樣的文字，重疊顯示，不過，投影效果是通過兩段文字的錯(cuò)位差實(shí)現(xiàn)的，例如通過margin負(fù)值讓上下的文字出現(xiàn)1像素的偏移。

您可以狠狠地點(diǎn)擊這里：margin錯(cuò)位下的文字投影效果demo

在IE下的效果如下圖：

在FireFox瀏覽器下效果為：

可以發(fā)現(xiàn) ，此方法實(shí)現(xiàn)的效果是真正意義上的兼容，基本上像素毫厘不差。
【IE下實(shí)現(xiàn)類似CSS3 text-shadow文字陰影的幾種方法】相關(guān)CSS代碼如下：

復(fù)制代碼代碼如下:
.bg{width:512px; height:340px; margin:1em auto; background:url(http://image.zhangxinxu.com/image/study/s/s512/mm19.jpg);}
.font{margin:0; padding:1em; font-size:36px; font-family:"微軟雅黑"; float:left;}
.sh{margin:-1px 0 0 -1px; color:#fff; position:absolute;}

HTML代碼如下：

復(fù)制代碼代碼如下:
div class="bg"
h4 class="font"span class="sh"張小姐長大了！/spandiv張小姐長大了！/div/h4