为了账号安全,请及时绑定邮箱和手机立即绑定

按钮特效

江老实 Web前端工程师
难度初级
时长 2小时 0分
学习人数
综合评分9.77
113人评价 查看评价
9.9 内容实用
9.8 简洁易懂
9.6 逻辑清晰
加上还是会有新的bug存在啊,连续快速滑动,tip就不回消失了
老师讲的很详细,浅显易懂,值得一看
之前的幽灵按钮课程用到span:hover哦
看起来炫爆了~~~!!
li a{
text-decoration:none;
display:inline-block;
color:black;
padding:7px 15px;
}
li a:hover{
background-color:#21530C;
color:white;
border-top-right-radius:6px ;
border-top-left-radius:6px ;
}

已采纳回答 / 慕前端4408879
那样就不能自适应地增大a的宽度了吧
给老师点赞!!!为自己加油!

已采纳回答 / purple_yao
你是说这一小节?如果是这一小节视频,是讲得按钮的左边线的动画实现。
$('.tip').stop(true,false).animate();
老师讲得非常详细知识点也分析得到位,先挖坑指出开发过程中可能遇到的问题再解决的教学方式很棒,谢谢老师!
看完line-top以后,没看下面视频之前,同理自己写了其余的,都成功了呢

已采纳回答 / 可奈姆
因为根据盒模型width是内容的宽度不包括padding,boder,margin
课程须知
1、你至少具备photoshop简单基础知识。 2、熟悉html基础知识,尤其对<input>标签、<a>标签、<span>标签和css样式比较了解。 3、有(X)HTML和CSS2基础及对HTML5和CSS3有所了解的童鞋们。
老师告诉你能学到什么?
1、如何制作圆角按钮 2、如何拆解动画效果 3、如何使用transform属性实现旋转 4、如何使用transition属性实现过渡

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消