From 1a6565b3477eb411b08258455b8499287ac4b09d Mon Sep 17 00:00:00 2001 From: caoshuangna <1021916098@qq.com> Date: Mon, 10 Dec 2018 15:38:42 +0800 Subject: [PATCH] modify 0401 --- chapters/04/01.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/chapters/04/01.md b/chapters/04/01.md index 55adae8..644bc2d 100644 --- a/chapters/04/01.md +++ b/chapters/04/01.md @@ -8,15 +8,15 @@ 我最近发现的一个很好的例子是Fabric登陆页面。CSS animatiom显示了Fabric如何为模块化框架工作。 -
![Source: https://get.fabric.io/](../../images/fabric-min.gif)
+![Source: https://get.fabric.io/](../../images/fabric-min.gif) 另一个有趣的例子是Mailchimp主页。在这里，hero image讲述了如何创建电子邮件的故事。 -
![Source: http://mailchimp.com](../../images/mailchimp-min.gif)
+![Source: http://mailchimp.com](../../images/mailchimp-min.gif) 您可能还在[my CSS Animation 101 email course](https://cssanimation.rocks/courses/animation-101/)登录页面上看到了它： -
![Source: https://cssanimation.rocks/courses/animation-101/](../../images/course-min.gif)
+![Source: https://cssanimation.rocks/courses/animation-101/](../../images/course-min.gif) 在以上示例中，他们都使用动画来设置页面的色调并说明网站的内容。 @@ -24,7 +24,7 @@ 让我们创建一个例子。在这个例子中，我创建了一个在网页上下移动的“web page”样式图形。 -
![Source: http://codepen.io/donovanh/pen/LEwedW?editors=110](../../images/screen-min.gif)
+![Source: http://codepen.io/donovanh/pen/LEwedW?editors=110](../../images/screen-min.gif) 对于一些交互、动画暂停、鼠标悬停在屏幕上时显示消息等都是利用animations和transitions来实现的。 @@ -116,7 +116,7 @@ 由于我们在“message”样式上设置了`transition`，因此当光标悬停在元素上和离开时，它都会创建动画。暂停的动画和过渡效果如下所示： -
![Source: http://codepen.io/donovanh/pen/LEwedW?editors=110](../../images/screen-hover-min.gif)
+![Source: http://codepen.io/donovanh/pen/LEwedW?editors=110](../../images/screen-hover-min.gif) ## Summary