Question

我是webdesign的新手，我有一个特别的例子，好吧我被困在这里：您有3个图像组合徽标，当您将鼠标悬停在中间图像上时，侧面的每个图像均为50px。我已经实现了使用填充在右侧移动图像的目标，但是当我尝试对左侧执行相同操作时，我的图像开始向左跳并返回到原始位置。

如果某人有更好的建议我喜欢研究它。

这是我希望实现的example。

我想出了这段代码：

    #logo_levo{
        position: absolute;
        float: right;
        width: 111px;
        height: 111px;
        -moz-transition:all 0.3s linear;

    }
    #logo_levo:hover{
        padding-right: 100px;
    }

HTML：

<img id="logo_levo" src="data/images/Class_B_obroc1_logo.png"/>

Answer 1

好的，这是你可以继续工作的东西。关于小提琴的CSS规则。检查小提琴

fiddle here

<div id='logo'>
  <div id='a'></div><!--left image-->
  <div id='b'></div><!--middle image-->
  <div id='c'></div><!--right image-->
</div>

图像在悬停时向左移动

1 个答案: