html 边框循环变色,方框用过渡走一圈变色用css怎么实现

满意答案

KKKso

2017.04.04

采纳率：44% 等级：9

已帮助：61人

方框用过渡走一圈变色用css实现方法

CSS3样式，ClassName = animate

.animate{

width:65px;

height:40px;

background:#92B901;

color:#ffffff;

position:absolute;

font-weight:bold;

font:12px '微软雅黑', Verdana, Arial, Helvetica, sans-serif;

padding:20px 10px 0px 10px;

display:blcok;

margin:5px;

-webkit-transition:-webkit-transform 1s,opacity 1s,background 1s,width 1s,height 1s,font-size 1s;

-webkit-border-radius:5px;

-o-transition-property:width,height,-o-transform,background,font-size,opacity;

-o-transition-duration:1s,1s,1s,1s,1s,1s;

-moz-transition-property:width,height,-o-transform,background,font-size,opacity;

-moz-transition-duration:1s,1s,1s,1s,1s,1s;

transition-property:width,height,transform,background,font-size,opacity;

transition-duration:1s,1s,1s,1s,1s,1s;

border-radius:5px;

opacity:0.4;

}

.animate:hover{

-moz-transform: rotate(360deg);

-webkit-transform: rotate(360deg);

-o-transform: rotate(360deg);

transform: rotate(360deg);

opacity:1;

background:#1ec7e6;

width:90px;

height:60px;

font-size:16px;

}

00分享举报

html 边框循环变色,方框用过渡走一圈变色用css怎么实现相关推荐

cserialport 循环发送信号_10个动作三个循环，练完至少瘦一圈，吃多了也不用担心...
今天是爱健身(微信号:love-fitness)推送的第594次健身打卡,练习内容有10个动作组成. 用这10个动作在家练起来,每次3个循环,练完至少瘦一圈,吃多了也不用担心.练习过程中,动作与动作之 ...
vant按需引入没样式_传统背景墙早看腻了，不如走一圈石膏线简单好看，8种样式随意选...
装修最忌讳的就是千篇一律,再好看的设计,也迟早会看腻味的.是时候告别传统电视墙做法,换成走一圈的石膏线,简单.省钱又好看.当然想要石膏线固定在墙面上不土,自然不能自己想怎么样就怎么样的,具体的做法我来 ...
【前端】html+css实现鼠标悬浮变色的按钮，消除加粗边框发生抖动现象的两种方法 hover【HTML+CSS+JavaScript(JS)】
效果: 代码: <!DOCTYPE html> <html><head><meta charset="utf-8"><titl ...
html选中后当前变色,JS代码实现表格选中后变色操作有哪些代码？
[实例代码]html xmlns=http://www.w3.org/1999/xhtml head title无标题页-学无忧(www.xue51.com)/titlescript language ...
js写css3过渡前端,web前端vue之CSS过渡效果示例
过渡效果在交互体验中的重要性不言而喻.以往我们使用js或Jquery添加或移除元素的类(class),搭配CSS中定义好的样式,再引用一些javascript库之后,可以做作出非常复杂,惊艳的动态效果 ...
java鼠标经过时变色_鼠标经过时单元格变色
鼠标经过时单元格变色 table{ color:#565; font:12px Arial, Helvetica, sans-serif; } td{ border-bottom:2px solid ...
php判断第一个插入css,织梦dedecms的arclist循环中判断第一个li,则添加固定的css否则不加...
dedecms的arclist循环中,判断如果是第一个li,则添加固定的css,否则不加经过测试,同样在channel标签里也适用. 写法如下: 复制代码代码如下:{dede:arclist row ...
android 字体点击变色,Android TextView 中实现部分文字变色以及点击事件
首先要想实现文字变色以及点击,都需要使用到SpannableStringBuilder,实例化该类也很简单,只需将你想要处理的字符串当做参数 SpannableStringBuilder spanna ...
php按钮鼠标感应就变色,JavaScript_JS实现网页滚动条感应鼠标变色的方法，本文实例讲述了JS实现网页滚 - phpStudy...
JS实现网页滚动条感应鼠标变色的方法本文实例讲述了JS实现网页滚动条感应鼠标变色的方法.分享给大家供大家参考.具体实现方法如下: JS实现网页滚动条感应鼠标变色把你的目光转向右侧的滚动条看一下吧? ...

html 边框循环变色,方框用过渡走一圈变色用css怎么实现

html 边框循环变色,方框用过渡走一圈变色用css怎么实现相关推荐

最新文章

热门文章