动效
4篇文章 · 0订阅
  • iOS 开关按钮
    大家好，我是 Steven。 点击一下会打开，再点击一下会关闭。但原来它还有一个小细节，就是长按的时候里面的圆形会拉长，放手后会变回圆形： 按钮的背景颜色就会改为深灰色。 在这个案例中，我们会学习到如何使用 CSS 建构这个按钮，过程中会运用到 CSS 的变数，以及如何判断系统…
    CSS
    iOS 开关按钮
  • iPhone 12 页面卷动逐行滑入效果
    大家好，我是 Steven。 打开 CodePen 编辑器，在 HTML 的部份加入标题。由于它有一个副标题，所以我会用 <p> 标签去装着它。然后加入一个 <div>，id 名为 iphone，里面新增两个 <div>，id 分别是 hardwa…
    CSS
    iPhone 12 页面卷动逐行滑入效果
  • App Store 卡片展开效果
    大家好，我是 Steven。 本来想只用 HTML 和 CSS 去制作，但最后都要运用到 JavaScript，那我们立即开始吧。 打开 CodePen 编辑器，首先建立 HTML 结构。新增一个 <div>，class 是 card，里面新增图片，图片来源使用 Un…
    CSS
    App Store 卡片展开效果
  • 【Apple官网特效】iPhone 12 网页文字渐入效果
    大家好，我是 Steven。 苹果网站向来是前端学习的好途径，最新发布的 iPhone 12 的产品介绍网页上就有一个文字渐入效果，这次我们会介绍这个效果是如何实现的。 打开 CodePen 编辑器，先在 HTML 的部份加入一个标题。 然后就可以专注在 CSS 的部份，加入 …
    CSS
    【Apple官网特效】iPhone 12 网页文字渐入效果