css文字阴影渐渐模糊效果的实现

  发布时间:2020-12-07 15:46:07   作者:诗水人间   我要评论
这篇文章主要介绍了css文字阴影渐渐模糊效果的实现,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
(福利推荐:【腾讯云】服务器最新限时优惠活动,云服务器1核2G仅99元/年、2核4G仅768元/3年,立即抢购>>>:9i0i.cn/qcloud

(福利推荐:你还在原价购买阿里云服务器?现在阿里云0.8折限时抢购活动来啦!4核8G企业云服务器仅2998元/3年,立即抢购>>>:9i0i.cn/aliyun

text-shadow
为文字添加阴影。可以为文字与 text-decorations 添加多个阴影,阴影值之间用逗号隔开。每个阴影值由元素在X和Y方向的偏移量、模糊半径和颜色值组成。

text-shadow: 10px 10px 20px pink;/*x轴偏移10px,y轴偏移10px,模糊程度,粉红色*/

transition:1s;渐变效果1秒,起到慢慢渐变得效果

<style type="text/css">
	h1:hover{
		color:rgba(0,0,0,0);
		text-shadow:black 0 0 100px;
	}
</style>
<h1>测试内容</h1>

ps:下面看下CSS禁止系统滚动条

先将html和body元素的height都设置为100%,然后将其overflow设置为hidden即可

html,body{
 height:100%;
 overflow:hidden;
}

到此这篇关于css文字阴影渐渐模糊效果的实现的文章就介绍到这了,更多相关css文字渐渐模糊效果内容请搜索程序员之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持程序员之家!

相关文章

最新评论

?


http://www.vxiaotou.com