设为首页
收藏本站
开启辅助访问
全部
问与答
创意
技术
酷工作
生活
交易
节点
飞墙
Follow
明白贴
工算小助手
登录
注册
飞社-令人惊奇的创意工作者社区-
›
首页
›
CSS
›
技术文章翻译: CSS 实现极简的 LQIP
FSHEX=FIND+SHARE+EXPRESS
飞社-令人惊奇的创意工作者社区- 是一个关于发现分享表达的地方
现在登录
没有账号?
立即注册
推荐主题
›
结婚前隐瞒了我爸曾经因为肇事逃逸坐过几个
›
开发了一款无广告的下载器
›
咨询大家一个职场陷阱,如何破局
›
很好奇,国内的公务员事业单位面试存不存在
›
为什么绝大部分网站,用户光标 hover 按钮
今日热议主题
低价出 Google one ai pro Gemini
给 AI $100 炒币第 10 天:被骂了一顿后重
长文本排版 + 2K 清晰度 + 生图/改图一体
出 无限 0 刀 1 刀虚拟卡 顶级卡头
[油猴脚本] 豆瓣小组成员申请备注
如何让五年级学生更好的理解这道题
问题发现-关于 proxifier 偶发展示真实 IP
泼盆冷水, claude opus4.6 没有那么神!
NAS 上有什么可以搭建的 备忘录/ToDo/项目
分享一个神器: Claude Code 里一句 /publi
技术文章翻译: CSS 实现极简的 LQIP
sugarkeek
· 2025-4-16 19:55:21 · 270 次点击
又看到一篇感兴趣的英文文章,简单翻译了一下,
[仅用 CSS 实现极简的模糊图片占位符](
https://halo.chenkeyan.com/archives/fe-weekly-8-css-lqip
)
其实简单来说就是,提取图片的几个主要颜色,用整数编码,通过 CSS 的计算属性计算成背景图片,实现模糊图片占位符。再细节一点就是怎么思考的,怎么解码的,怎么渲染成 LQIP 的等等。
效果可以看看:
英文原文在这:
https://leanrada.com/notes/css-only-lqip/
可以看看作者的 demo:
https://leanrada.com/notes/css-only-lqip/gallery/
这是我复现的:
https://codepen.io/showmecode_ahh/pen/VYYwjZq
举报
·
270 次点击
登录
注册
站外分享
微信扫一扫
QQ分享
微博分享
豆瓣分享
复制链接
显示全部
|
最早评论
1 条回复
沙发
FanyFull
小成
2025-4-16 20:22:31
好文,这个用在音乐网站的歌词背景颜色挺合适,颜色就从专辑照片中提取。
返回顶部