HTML

<a href="#" title="">test</a>

CSS

a {display:block; width:200px; line-height:2em; border: 1px solid #000; text-align: center;}

a:hover {width:300px; background-color: #f00; transition-duration:0.2s;}

只要在:hover里写 transition-duration 就可以了

transition动画最简使用方式的更多相关文章

  1. 移动端 transition动画函数的封装（仿Zepto）以及 requestAnimationFrame动画函数封装（仿jQuery）

    移动端 css3 transition 动画 ,requestAnimationFrame 动画  对于性能的要求,h5优先考虑: 移动端 单页有时候 制作只用到简单的css3动画即可,我们封装一下, ...

  2. CSS3集锦之新增选择器、圆角、阴影、透明度、transition动画、transform变形、animation动画

    ---恢复内容开始--- 一.CSS3新增选择器 1.nth-chlid(n)用法 selector:nth-chlid(n)指找到第n个子元素并且该元素为selector标签 <!DOCTYP ...

  3. Swift: 是用Custom Segue还是用Transition动画

    用一个很简单的场景做为例子:在storyboard上,你有用UINavigationController串起来两个UIViewController.这两个controller之间要互相跳转,A-> ...

  4. 实现activity跳转动画的若干种方式

    第一种: (使用overridePendingTransition方法实现Activity跳转动画) 在Activity中代码如下 /** * 点击按钮实现跳转逻辑 */ button1.setOnC ...

  5. CSS3的transition动画功能

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  6. css3 Transition动画执行时有可能会出现闪烁的bug

    css3 Transition动画执行时有可能会出现闪烁的bug,一般出现在开始的时候. 解决方法: 1.-webkit-backface-visibility: hidden; 2.-webkit- ...

  7. 解决transition动画与display冲突的几种方法

    如demo(如果没有显示,请查看源地址http://jsfiddle.net/ihardcoder/HNduT/2/)所示,基本的效果是在点击“Translate”按钮后,蓝色区域透明度变为0,然后隐 ...

  8. appendChild与Transition动画

    在createElement之后,直接把这个div append到body中,是不会触发css3 transition动画的 必须要让浏览器计算div的css属性后,然后再设置div的style,才会 ...

  9. css3动画的两种方式transition和@keyframs

随机推荐

  1. CMake最好的学习资料

    本文为转载,阅读不友好,请先查看原文:https://blog.gmem.cc/cmake-study-note 收下为原文内容＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝> 基础知识 CMake简介 CM ...

  2. BZOJ 3362 Navigation Nightmare

    一道带权并查集题目. 带权并查集的重点是信息的合并. 这类题出现得并不多,练习一下. #include<bits/stdc++.h> using namespace std; #defin ...

  3. g2o求解BA 第10章

    1.g2o_bal_class.h1.1 projection.hg2o还是用图模型和边,顶点就是相机和路标,边就是观测,就是像素坐标.只不过这里的相机是由旋转(3个参数,轴角形式,就是theta*n ...

  4. <ReversingEngineering>关于windows32位系统下的dll注入技术经验汇

    上个学期把自己闷在图书馆一直在看关于逆向工程技术方面的书,从入门到初级,现在也敢说自己一条腿已经迈进了这片知识的大门里,因为该博客刚开通先将一些经验记录下来,也是留给自己一方面做个参照. <逆向 ...

  5. springboot简单介绍

    1.springboot简单介绍 微服务架构 Spring Boot 是由 Pivotal 团队提供的全新框架,其设计目的是用来简化新 Spring 应用的初始搭建以及开发过程. 该框架使用了特定的方 ...

  6. CentOS 7 设置自定义开机启动,添加自定义系统服务

    详细文档,http://www.linuxidc.com/Linux/2015-04/115937.htm 摘自: http://www.centoscn.com/CentOS/config/2015 ...

  7. 阿里大于短信服务_异常_01_InvalidTimeStamp.Expired

    一.异常信息 dm.aliyuncs.com InvalidTimeStamp.Expired Specified time stamp or date value is expired. 二.异常原 ...

  8. CDH5.12.1 安装部署

    ###通过http://192.168.50.200:7180/cmf/login 访问CM控制台 4.CDH安装 4.1CDH集群安装向导 1.admin/admin登陆到CM 2.同意licens ...

  9. OGG 进程清除、重建

    背景描述:有时候OGG进程同步出现问题,症状某些进程起不来,而且问题一时半会儿解决不了.最简单的办法是:用数据泵初始化数据,OGG进程重建. 1.查看源端.目的端的进程状态. (作者OGG进程是正常的 ...

  10. loj 6089 小 Y 的背包计数问题——分类进行的背包

    题目:https://loj.ac/problem/6089 直接多重背包,加上分剩余类的前缀和还是n^2的. 但可发现当体积>sqrt(n)时,个数的限制形同虚设,且最多有sqrt(n)个物品 ...