1.animate parts of your design without the need for the likes of JavaScrip

2.allowing smooth animation (rather than a jump from one state to another).

transition:[transition-property-default:all],

transition-duration,

[transition-timing-function-default:ease],linear ,ease-in ,ease-out ,ease-in-out,cubic Bézier curve(n,n,n,n)

transition-deplay:default:0];

eg

a:link{

transition:all,.5s,linear,0;

}

a:link{

transition:color .5s font-size 2s;

}

【CSS3】Advanced7:CSS Transitions的更多相关文章

  1. 【CSS3】Advanced8:CSS Backgrounds: Multiples, Size, and Origin

    1.Multiples,Size,and Origin eg:background-image:url(bg.png),url(bullet.png) 0 50% no-repeat,url(arro ...

  2. 【CSS3】Advanced3:Universal, Child, and Adjacent Selectors

    1.Universal selectors eg:#target*{ } 2.Child selectors < something immediately nested within some ...

  3. 【CSS3】Advanced11:Media Queries

    1.Browser-size specific CSS @media screen and (max/min-width:1000px){} 2.Orientation-specific CSS? @ ...

  4. 【CSS3】Advanced6:Attribute Selectors

    1.with the attribute abbr[title]{color:red} 2.with the attribute and it's value input[type=text][dis ...

  5. 【CSS3】Advanced5:At Rules:@import, @media, and @font-face

    1.@import bolt another stylesheet onto your existing one. @import url(**.css); must be placed at the ...

  6. 【HTML】Advanced7:Embedded Content: Video, Audio, and Canvas

    1.video <video src="kitties.mp4" poster="fluffy.jpg"(display before video is ...

  7. 【HTML】Advanced7:HTML5 Forms Pt. 2: Attributes and Data Lists

    1.<label for"" ></label> <input type="email" placeholder=" & ...

  8. 【CSS3】Advanced10:Gradient

    1.background:linear-gradient(20deg/(to) bottom right,orange,red,hsl(60,100%,50%)); 2.-webkit-chrome/ ...

  9. 【CSS3】Advanced9:Transformation

    1.transform:rotate(-10deg) skew(20deg,10deg) scaling(2/1,2) translate/移动(100px,200px) 2.transform:ma ...

随机推荐

  1. 使用Adobe Photoshop CC 2015批量修改图片尺寸

    最近在工作中遇到一个问题,当时客户给的图片尺寸与我要求的图片不符,由于图片非常的多,如果一张一张的修改,十分的麻烦,后来经过一位同事的指点,发现Adobe Photoshop CC 2015可以实现批 ...

  2. WinForm小小应用

    制作日历计划任务 private void BeginTask() { Thread th = new Thread(//建立线程 (() =>//使用Lambda表达式 { while (tr ...

  3. UIExtendedEdge

    在IOS7以后 ViewController 开始使用全屏布局的,而且是默认的行为通常涉及到布局.就离不开这个属性 edgesForExtendedLayout,它是一个类型为UIExtendedEd ...

  4. pywinauto二次封装(pywinnat.py)

    将pywinauto常用方法进行封装,使得pywinauto用起来更简单 #头文件的引入 from pywinauto import application from pywinauto import ...

  5. AVQueuePlayer,备用

    想要视频一个接一个的无缝连续播放么?还在用二逼的mpmovieplayercontroller么?太out了!本大仙介绍一个可以实现无缝连续播放视频的东西-------AVQueuePlayer ! ...

  6. python中的reduce

    python中的reduce内建函数是一个二元操作函数,他用来将一个数据集合(链表,元组等)中的所有数据进行下列操作:用传给reduce中的函数 func()(必须是一个二元操作函数)先对集合中的第1 ...

  7. hex(x) 将整数x转换为16进制字符串

    >>> a = 122 >>> b = 344 >>> c = hex(a) >>> d = hex(b) >>&g ...

  8. SPRING IN ACTION 第4版笔记-第七章Advanced Spring MVC-001- DispatcherServlet的高级配置(ServletRegistration.Dynamic、WebApplicationInitializer)

    一. 1.如想在DispatcherServlet在Servlet容器中注册后自定义一些操作,如开启文件上传功能,则可重写通过AbstractAnnotationConfigDispatcherSer ...

  9. MS提供的虚拟机IE测试

    https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/

  10. Yii 实现restful

    首先做一下接口的 URL 规划,假设我们要面对的资源是 item ,现在我们暴露5个接口供其他应用调用,分别是: 对于所有 item 列表调用: GET /rest/item 对于某个 item 信息 ...