                        课程
                    
                        /前端开发
                        
                            /CSS3
                        
                        /CSS3实现漂亮ToolTips效果

第四个图标有个问题

有个问题在第四个图标里面需要里面的小图标是静态的不变任何位置，所以你把小图标改成20PX，圆圈改成-20PX 来实现小图标静止不动的效果，但是你鼠标移动之后hover 会吧小图标还原到以前的位置，等于你之前设置的小图标的20PX 无线还会形成一个上升的效果

慕丝6073136

2015-04-08

源自：CSS3实现漂亮ToolTips效果 1-6

关注问题我要回答

1552

操作

收起

2 回答

北瓜回答被采纳 +3 积分
2016-06-02

第四个图标是需要设置 i 从下往上，从而抵消tooltip-content从上往下的运动

给I设置 transform: translate3d(0,20px,0);就可以了

0 回复有任何疑惑可以回复我~

收起回答

慕丝6073136 提问者

非常感谢！

2016-11-22 回复有任何疑惑可以回复我~

慕沐900688
2017-07-30

我在i里面写了 transform: translate3d(0,20px,0);的，但还是在鼠标移除后有一个上升的效果，题主是怎么解决的？

0 回复有任何疑惑可以回复我~

收起回答

0/150

提交

取消

CSS3实现漂亮ToolTips效果

参与学习 42722 人
解答问题 101 个

CSS3 实现鼠标悬停弹出信息提示框，学习达到对CSS3深入了解的目的

进入课程

本课相似问答

3 回答第四、第五的图标的问题

1 回答第三个图标

2 回答第五个scale3d z轴有问题

3 回答老师第四个图标我是按的代码写的为啥感觉里面的图标还是一上一下的感觉好怪求制导

1 回答在Firefox上有两个问题啊

搜索更多本课相关问答

第四个图标有个问题

我要回答关注问题

热搜

最近搜索清空

第四个图标有个问题

2 回答

本课相似问答

第四个图标有个问题