CSS3文字描边效果
生活随笔
收集整理的這篇文章主要介紹了
CSS3文字描边效果
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
CSS3 中有text-stroke屬性，加上-webkit-前綴兼容性也還不錯，但是只有在字體很大的時候才能看到描邊效果，如果字體比較小，描邊顏色會遮住文字本身顏色。
上圖為黑色字體白色描邊，字體顏色被遮蓋
當然text-stroke也有hack的方法來實現陰影，那就是先設置font-size為一個比較大的值，再進行scale操作。
還有第二種方法，我們可以通過字體陰影text-shadow實現文字描邊效果
text-shadow:2px 2px 0px #fff但是描邊比較細，并且陰影是單方向的，我們可以添加對稱方向的陰影：
如果覺得文字描邊不夠粗，可以使用多重字體陰影，這樣就可以比較粗的描邊
1px 1px 0px #FFFFFF, -1px -1px 0px #FFFFFF, 2px 2px 0px #FFFFFF, -2px -2px 0px #FFFFFF, 3px 3px 0px #FFFFFF, -3px -3px 0px #FFFFFF
總結
以上是生活随笔為你收集整理的CSS3文字描边效果的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 网络安全实验4 防火墙技术的具体应用
- 下一篇： css 水珠动图,CSS3 水滴和波浪动