simplify the life

随笔分类 -  CSS3/CSS

一个样式问题引发的对 overflow 属性的再度学习
摘要：最近开发碰到一个 bug，其实把它写成最小 demo 很简单，大概这样： 点击查看代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content= 阅读全文

posted @ 2023-03-03 08:27 lessfish 阅读(150) 评论(0) 推荐(0)

transition、@keyframes animation 和 Hover.css
摘要：transition Transitions enable you to define the transition between two states of an element. Different states may be defined using pseudo-classes like 阅读全文

posted @ 2023-02-27 21:50 lessfish 阅读(192) 评论(0) 推荐(0)

由 Sweep To Right 动效引发的对 z-index 的再度学习
摘要：z-index MDN ｜ Hover.css 对于一个已经定位的盒子（即其 position 属性值不是 static），z-index 属性指定： 盒子在当前堆叠上下文中的堆叠层级 盒子是否创建一个本地堆叠上下文（后代元素的 z-indexes 不与此元素外部的 z-indexes 进行对比） 阅读全文

posted @ 2023-02-27 21:31 lessfish 阅读(38) 评论(0) 推荐(0)

打字机游戏Ⅱ之手速pk
摘要：前言 demo预览-> typewriter gameⅡ （chrome only 没做兼容） 别看一开始时速度不快，会线性增长的哦，反正楼主的score还没达到过40... 为什么叫Ⅱ呢？之前写了个打字机游戏（试玩猛戳这里），数据上只是简单的手写了50个单词，全部输入正确即可过关，本来想改一下做成 阅读全文

posted @ 2015-03-16 16:39 lessfish 阅读(1205) 评论(0) 推荐(2)

css3实践之摩天轮式图片轮播+3D正方体+3D标签云（perspective、transform-style、perspective-origin）
摘要：本文主要通过摩天轮式图片轮播的例子来讲解与css3 3D有关的一些属性。 demo预览： 前文回顾 在前面的文章css3实践之图片轮播（Transform，Transition和Animation）中我们简单地了解了css3旗下的transform、transition以及animation。回顾一 阅读全文

posted @ 2015-03-09 09:13 lessfish 阅读(3362) 评论(2) 推荐(5)

css3实践之图片轮播（Transform，Transition和Animation）
摘要：楼主喜欢追求视觉上的享受，虽常以牺牲性能无法兼容为代价却也乐此不疲。本文就通过一个个的demo演示来简单了解下css3下的Transform，Transition和Animation。 本文需要实现效果：（请用chrome打开） Transform 根据我的理解，transform和width、he 阅读全文

posted @ 2015-03-06 10:22 lessfish 阅读(5093) 评论(7) 推荐(2)

导航