怎样用CSS样式制作边缘光晕的模糊效果

怎样用CSS样式制作边缘光晕的模糊效果,第1张

1、首先新建一个简单的html文件,如图所示。

2、然后根据自己的需要,简单的设置一下层宽高和图片样式

3、新建一个用于局部模糊的层,利用绝对定位和z-index使它浮动在图片上面,效果如果所示。

4、然后细调css的样式使它达到自己想要的效果,比如想让中间的S模糊。

5、最后预览下如下图所示,就完成了。

拜托你还是用图片吧,CSS效果对于浏览器的兼容是一个问题。比如IE6和Firefox低版本的。

或者你可能是需要日期每天变化的,所以不能用图片,我理解你的苦衷。但我不知道你对网页前端设计是否有研究,类似这样的内容文本,很多人尤其是新手往往总是追求一些花哨炫灿的效果,但这样下来的结果是,网页上每个元素都弄的很炫,五彩缤纷、花团锦簇的,这会给访问者带来极大的不适感。对于网页的浏览是具有负面效应的。

建议你学习一下网页美学,或者举个最简单的例子。耐克专门店的招牌,一个大面积的黑色上只有一个白色的对号,这样的美学才会向访问者传递一个良好的信息和用户体验。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7023965.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-31
下一篇 2023-03-31

发表评论

登录后才能评论

评论列表(0条)

保存