首页
沸点
课程
数据标注
HOT
AI Coding
更多
直播
活动
APP
插件
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
css
订阅
预见未来
更多收藏集
微信扫码分享
微信
新浪微博
QQ
8篇文章 · 0订阅
我写CSS的常用套路
本文是笔者写CSS时常用的套路。不论效果再怎么华丽,万变不离其宗。 有时候,我们需要给多个元素添加同一个动画,播放后,不难发现它们会一起运动,一起结束,这样就会显得很平淡无奇。 那么如何将动画变得稍微有趣一点呢?很简单,既然它们都是同一时刻开始运动的,那么让它们不在同一时刻运动…
纯CSS实现简单骨骼动画
某天设计师来找我说,“这个心愿牌傻傻地挂在那不好看,加个动效呗,就左右摆动一下就行,很简单的!”,我一想,行呀,提升用户视觉体验,开搞。 十分钟后,🥶不对呀,这个左右摆动好假,不像现实中风吹的效果。 冷静思考🤔,为啥这个摆动会没有灵魂。于是拿起工卡开始摆动,看看现实中的摆动…
《前端实战总结》之使用纯css实现网站换肤和焦点图切换动画
今天我们来继续复盘一些工作中常用的css技巧和知识,以便我们可以更加优雅的用css实现富有动感的网站. 以上几个方案都可以实现一定程度上的换肤效果,但是如果是一些基础性的换肤,比如网站的背景样式,某个按钮的样式,某块内容区域的样式等等这种局部的换肤,我们能不能直接用css来实现…
探索CSS单行文字居中,多行文字居左的实现方式
琢磨了一下,当时我还真按照产品经理的逻辑,通过js判断一下文字的高度,如果超过一行,就添加一个类名,而且这样的文字很多地方都有,所以还做了遍历,还有最重要的一点是关于方法执行的时机,有可能刚加载的时候高度还获取不到(当时好像还用了定时器,还造成了先居中随后居左跳动的现象)...…
巧用 CSS 实现酷炫的充电动画
循序渐进,看看只使用 CSS ,可以鼓捣出什么样的充电动画效果。 欧了,勉强就是它了。有了电池,那接下来直接充电吧。最最简单的动画,那应该是用色彩把整个电池灌满即可。 有内味了,如果要求不高,这个勉强也就能够交差了。通过蓝色渐变表示电量,通过色块的位移动画实现充电的动画。但是总…
重整旗鼓,2019自结前端面试小册【CSS + HTML】
临近2019年的尾声,是不是该为了更好的2020年再战一回呢? ‘胜败兵家事不期,包羞忍耻是男儿。江东子弟多才俊,卷土重来未可知’,那些在秋招失利的人,难道就心甘情愿放弃吗! 此文总结2019年以来本人经历以及浏览文章中,较热门的一些面试题,涵盖从CSS到JS再到Vue再到网络…
b站全灰,原来仅需一行css代码——css 滤镜
今天打开b站,看见一片灰色。对于公祭日,我们每一个人都应该为此默哀、纪念历史,都要铭记历史、热爱祖国、砥砺前行 首先,职业下意识就打开了控制台。为什么呢?是想看看怎么实现的,是css自定义属性吗?是引入一份css吗?是预处理器修改全局变量吗?结果,打开控制台,浏览了一下,最后定…
请收下这72个炫酷的CSS技巧
CSS是一门很特殊的语言,不像一般的编程语言那样需要抽象的思维和严密的逻辑,它真正需要的是想象力——将你脑中所想的意象用代码来表现出来。那么意象又是如何产生的呢?最常用的方法就是探索和观察。举个例子,笔者平时热爱看番,每看到有意思的场景画面总会下意识地记录下来,这对动画创作会非…