欢迎光临
我们一直在努力

标签:微信小程序

微信小程序——字体效果之凸起效果-半醉人间
微信小程序

微信小程序——字体效果之凸起效果

半醉, 人间阅读(1581)评论(1)赞(0)

        凸起效果的主要思路就是使用一长串累加的投影,不设模糊并以1px(这边用rpx) 的跨度逐渐错开,使颜色逐渐变暗,然后在底部加一层强烈模糊的暗投影,从而模拟完整的立体效果。 在上图中可以...

微信小程序——尖角对话框-半醉人间
微信小程序

微信小程序——尖角对话框

半醉, 人间阅读(872)评论(0)赞(0)

上一章中我们已经介绍了怎么实现切角效果,文章最后附带了三角形的实现方式,这边就利用三角形实现带尖角的对话框效果,角度方向可以根据需要调整。 我们将该效果分成两部分,一部分是顶部的尖角,另一部分是底部的文本框。这边直接贴代码,大家可以根据需要...

微信小程序——切角效果-半醉人间
微信小程序

微信小程序——切角效果

半醉, 人间阅读(672)评论(0)赞(1)

CSS渐变是个非常强大的功能吗,我们可以用来实现各种效果,这边我们就用渐变来实现切角效果。首先实现一个角被切掉的效果,以右下角为例。这其中最大的窍门在于充分利用渐变的一大特性:渐变可以接受一个角度作为方向,而且色标的位置信息也可以是绝对的长...

微信小程序——多重边框效果-半醉人间
微信小程序

微信小程序——多重边框效果

半醉, 人间阅读(723)评论(0)赞(0)

大多数人都用过box-shadow来生成投影,我们可以通过设置模糊值(第三个参数)为零,扩张半径(第四个参数)为一个正值来实现一个实线边框,效果等同于border实现的边框效果。 background: yellowgreen; box-s...