css
关注
分享
扫一扫
文章平均质量分 51
gronkie
一个大三咸鱼罢了，如果有什么问题，欢迎私信或者评论讨论，不过实力有限，还请多多包涵
展开
-
前端入门（雷云特效，css）
（推荐个别人写的css特效网站CSS3的奇思妙想，感觉有好多蛮好玩的功能，这个特效是在里面偏下面一点的位置）（最好还是看一下动画的演示效果，直接复制粘贴就行了）实现原理其实很简单，三个部分，云层，阴影和闪电云层部分的实现可以通过一个圆球加上阴影（这样就可以制造很多圆），多个圆通过设置位置进行堆叠就可以显示出云层的样子，然后让云层上下移动就可以了阴影部分的实现就是通过一个动画，一个边框为弧形的矩形（现在好像应该称呼它为椭圆形），让它不断进行缩放，并改变背景颜色深浅即可闪电部分的实现，大家应该都懂怎原创 2022-01-18 09:00:29 · 942 阅读 · 0 评论 -
前端入门（加载特效，css）
哈哈效果你们就这么看看吧，实在不会截取 gif ，将就将就，或者复制粘贴代码去看看吧（最好还是去看看效果）这个效果简单说就是有一个带有一半黑边框的圆用 ease-out （最后以慢速度结尾）进行旋转，还有一个半白边框的圆用 ease-in-out （以慢速度开头与结尾）进行旋转（用来覆盖黑边框），完成该效果，最终效果就是，黑边框先快速“摆脱”白边框（加载条变长），然后最后再变慢，最后在一个位置结尾（加载条变短）这个效果是由 3 个部分完成#loading_item 用一个比较慢的速度进行旋转，于是.原创 2022-01-16 22:14:36 · 671 阅读 · 0 评论 -
前端入门（水球特效，css）
（先分享个别人讲解的视频，八分钟我觉得不绰水球特效）大概思路就是一个圆圈加一个边框四个角有弧度的矩形，然后让矩形在平面上旋转，再把矩形多余的地方用 overflow: hidden; 藏起来就可以了其他就是一些小地方的修饰了，不太重要，看个人喜好，比如外面套一层 div ，设置一个粉色 3px 宽的边框，再设个 padding 和里面的隔开，设置个阴影，还有把矩形的转动速度设置为匀速（我觉得这样好看点）<!DOCTYPE html><html> <head&原创 2022-01-16 21:41:22 · 1254 阅读 · 0 评论 -
前端入门（雨滴特效，css）
（看着别人的做的，yysy视频讲的真的好详细，像我这种小白都能听懂了雨滴特效）大概思路就是，把每个雨滴看作是一个宽为 5px ， 长为 30px 的 div，然后用 js 创建窗口大小 / 5 个数量的雨滴，然后设置位置，让它们按行摆开（就是铺满）然后给它们赋予一个图像渐变属性 linear-gradient，让图像看起来是从透明渐变为一个随机颜色，再把雨滴的前端设置为圆形的（让它看起来像是一个雨滴，虽然很丑）最后设置一个动画效果，让雨滴从屏幕上方移动到屏幕下方直到看不见，循环进行该动画，给雨滴设置一原创 2022-01-15 16:38:29 · 2359 阅读 · 4 评论