css 的标签存档

利用CSS线性渐变、阴影、缩放实现动画下雨效果

利用CSS线性渐变、阴影、缩放实现动画下雨效果

前言 好雨知时节,当春乃发生。 随风潜入夜,润物细无声。 春节已经过去,新的一年刚刚开始,小伙伴们,今年你的目标是什么?定个小目标,挣他一个亿?分享一下我的目标,是让大家的web前端能力,更上一层楼。 下面进入主题,看下图: 这个动…
3种纯CSS方式实现Tab 切换

3种纯CSS方式实现Tab 切换

前言 Tab 切换是种很常见的网页呈现形式,不管是PC或者H5都会经常看到,今天就为小伙伴们提供多种纯CSS Tab 切换的实现方式,同时对比一下那种代码更方便,更通俗易懂。 纯CSS实现都面临2个问题: 1、 如何接收点击事件? …
纯CSS3实现loading虚影加载效果

纯CSS3实现loading虚影加载效果

前言 最近公司实在是太忙了,996的日子(当前时间凌晨2019-01-06 02:04),所以更新也少了,希望大家多体谅一下,在此对小伙伴们说声抱歉。 前几天接到小伙伴投稿,希望做一个类似loading的效果,也是只要手头有空就赶紧…
CSS制作可爱的小猪,祝大家2019“猪”事顺心

CSS制作可爱的小猪,祝大家2019“猪”事顺心

前言 时间过得真快,2019年也是说来就来,时间是真的不等人啊。新的一年小伙伴们都有什么目标呢?赶紧向着目标努力吧,2020也会眨眼即到。 2019,祝大家“猪”事顺利,事事顺心! 接下来进入今天的课题。用CSS制作一个小小的、可爱…
纯CSS制作一个评星组件(说出去都没人信)

纯CSS制作一个评星组件(说出去都没人信)

前言 纯CSS制作一个评星组件,说出去都没人信,你信吗? 如果让你制作上面图的效果,你会怎么开发了?可以下发评论说说你的想法。今天就来看看纯CSS是如何实现这个效果的。 HTML <div class="radio-stars…
VUE开发一个组件——Vue list列表滑动删除

VUE开发一个组件——Vue list列表滑动删除

前言 滑动删除,在很多APP软件里面可以见到,比如淘宝的订单列表,QQ微信的聊天记录等等,今天就来看看JavaScript是如何实现这个功能的,之所以说是vue,主要是框架是vue啦,主要还是JS+CSS部分。 页面部分 页面就超级…
CSS常用布局方式

CSS常用布局方式

前言 布局是CSS中一个很重要的部分,也是最不好处理的一部分,其他诸如字体大小、颜色等等都是很容易的。总结一下使用过的CSS常用布局,包括水平居中、垂直居中、单列布局、多列布局等,以及flex布局,希望能给前端同学一些帮助。 以下代…
奇技淫巧——CSS 实现波浪效果

奇技淫巧——CSS 实现波浪效果

前言 一直以来,使用纯 CSS 实现波浪效果都是十分困难的。 因为实现波浪的曲线需要借助贝塞尔曲线。 而使用纯 CSS 的方式,实现贝塞尔曲线,额,暂时是没有很好的方法。 当然,借助其他力量(SVG、CANVAS),是可以很轻松的完…
CSS中Flex布局的可伸缩性(Flexibility)

CSS中Flex布局的可伸缩性(Flexibility)

Flexibility Flex伸缩布局决定性的特性是让伸缩项目可伸缩,也就是让伸缩项目的宽度或高度自动填充剩余的空间。这可以以flex属性完成。一个伸缩容器会等比地按照各伸缩项目的 扩展比率 分配剩余空间,也会按照 收缩比率 缩小…
this is a cache: 0.00601