84669 人学习
152542 人学习
20005 人学习
5487 人学习
7821 人学习
359900 人学习
3350 人学习
180660 人学习
48569 人学习
18603 人学习
40936 人学习
1549 人学习
1183 人学习
32909 人学习
css如何实现这样的秒变效果呢
不用给这种复杂的图形描边,只要给一个p的border描边就行
当鼠标进入就给这个p的border加一个描边的效果,现在是直接的显示隐藏,感觉不好看。
求大神给一个demo或者方法,谢谢了先!
业精于勤,荒于嬉;行成于思,毁于随。
css3的新版特性动画应该可以解决。或者也可以这样、
<p> <img src="xxx,jpg"/> <span class="top"></span> <span class="bootom"></span> <span class="left"></span> <span class="right"></span> </p>
具体效果可以参考:http://www.jq22.com/yanshi1524
幽灵按钮或者按钮动画。
理论就是用span代替4个border。然后用css3或者jq来写动画
这种直接svg吧 svg描边动画
css
p{border:1px solid transparent} p:hover{boeder:1px solid gray}
就是p hover状态时,改变border的颜色
<style type="text/css"> .box { width: 100px; height: 100px; padding: 10px; transition: box-shadow .6s; } .box:hover { box-shadow: 0 0 6px 1px red inset; } </style> <p class="box">p</p>
css3的新版特性动画应该可以解决。或者也可以这样、
具体效果可以参考:
http://www.jq22.com/yanshi1524
幽灵按钮或者按钮动画。
理论就是用span代替4个border。然后用css3或者jq来写动画
这种直接svg吧 svg描边动画
css
就是p hover状态时,改变border的颜色