摘要:经常能看到有关 CSS 绘图的文章,譬如使用纯 HTML + CSS 绘制一幅哆啦 A 梦图画。实现的方式就是通过堆叠 div,一步一步实现图画中的一块一块。这种技巧本身没有什么问题,但是就是少了一些难度,只需要有耐心,很多图形还是能够被慢慢实现出来的。 基于 CSS 绘图的这个需求,逐渐又有了新的 阅读全文
posted @ 2021-06-01 10:29 ChokCoco 阅读(2184) 评论(12) 推荐(37) 编辑
摘要:依稀记得,某年广东语文高考作文的相关描述 -- “有时,常识虽易知而难行,有时,常识须推陈而出新”。人的想象力和创造力很容易在对常识的一贯认知中被削弱。 CSS 更新之快,只能不断鞭策自己持续学习,一直呆在舒适区中,很容易就跟不上节奏。当然,不仅仅是 CSS,对于任何技术任何行业也可以套用这句话。 阅读全文
posted @ 2021-05-27 10:39 ChokCoco 阅读(1981) 评论(8) 推荐(30) 编辑
摘要:文本将介绍 CSS 媒体查询中新增的几个特性功能: prefers-reduced-motion prefers-color-scheme prefers-contrast prefers-reduced-transparency prefers-reduced-data 利用好它们,能够很好的提升 阅读全文
posted @ 2021-05-24 11:08 ChokCoco 阅读(1164) 评论(3) 推荐(8) 编辑
摘要:在之前,我介绍过几种使用纯 CSS 实现波浪效果的方式,关于它们有两篇相关的文章: 纯 CSS 实现波浪效果! 巧用 CSS 实现酷炫的充电动画 本文将会再介绍另外一种使用 CSS 实现的波浪效果,思路非常有意思。 从定积分实现曲边三角形面积说起 在进入主题之前,先看看这个,在高等数学中,我们可以通 阅读全文
posted @ 2021-05-18 10:09 ChokCoco 阅读(1791) 评论(9) 推荐(17) 编辑
摘要:本文将介绍一种利用 CSS 获取图片主题色的小技巧。一起看看~ 背景 起因是微信技术群里有个同学发问,有什么方法能够获取图片的主色呢?有一张图片,获取他的主色调: 利用获取到的这个颜色值,来实现类似这样的功能 -- 容器中有一张图片,希望背景色可以适配图片的主色,像是这样: 大家出谋划策,有说利用 阅读全文
posted @ 2021-05-11 10:18 ChokCoco 阅读(602) 评论(2) 推荐(6) 编辑
摘要:在介绍新的 CSS 属性 contain 之前,读者首先需要了解什么是页面的重绘与重排。 之前已经描述过很多次了,还不太了解的可以先看看这个提高 CSS 动画性能的正确姿势。 OK,下面进入本文正题, contain 为何? contain 属性允许我们指定特定的 DOM 元素和它的子元素,让它们能 阅读全文
posted @ 2021-05-06 10:00 ChokCoco 阅读(1297) 评论(5) 推荐(8) 编辑
摘要:CSS 中有一个非常有意思的模块 -- CSS Motion Path Module Level 1,翻译过来也就是运动路径。本文将对 motion path 一探究竟,通过本文,你可以了解到: 什么是 CSS motion path 使用 CSS motion path 制作简单路径动画 使用 C 阅读全文
posted @ 2021-04-28 10:38 ChokCoco 阅读(1536) 评论(9) 推荐(19) 编辑
摘要:在之前的这篇文章 -- 一行 CSS 代码的魅力 中,我们介绍了一种使用一行 CSS 代码就能够生成的一种美妙(也许奇怪更合适)的背景。 本文,将继续介绍背景的一些有意思的知识,利用一些极小的单位,只需要短短几行代码,就能够产生出美妙而又有意思的背景效果~ 数量级对背景图形的影响 本文的主角主要是: 阅读全文
posted @ 2021-04-26 10:19 ChokCoco 阅读(2308) 评论(12) 推荐(22) 编辑
摘要:在最新的 Chrome Canary 中,一个有意思的 CSS 语法 Container Queries 得到了支持。 Chrome Canary:开发者专用的每日构建版,站上网络科技最前沿。当然,不一定稳定~ 而在最近几个 Chrome 版本中,有一些挺有意思的属性相继得到支持,本文就将介绍一下, 阅读全文
posted @ 2021-04-20 10:08 ChokCoco 阅读(569) 评论(1) 推荐(4) 编辑
摘要:本文主要讲讲 CSS 非常新的一个特性,CSS @property,它的出现,极大的增强的 CSS 的能力! 根据 MDN -- CSS Property,@property CSS at-rule 是 CSS Houdini API 的一部分, 它允许开发者显式地定义他们的 CSS 自定义属性,允 阅读全文
posted @ 2021-04-15 10:14 ChokCoco 阅读(1576) 评论(10) 推荐(13) 编辑