Html 带CSS的动画功能区-功能区位置

JSFiddle：

HTML:

组配置文件
编辑
提供者配置文件
编辑
场地概况
编辑


客户资料
编辑
责任方简介
编辑

如何修改类

图22

的CSS，使其与类

图11

相反（左上角，以及与角匹配的剪切）

例如：

---

您需要将“mainHolder”下“figure”元素的边距设置为0

.mainHolder figure {
    width: 200px;
    height: 200px;
    overflow: hidden;
    position: relative;
    margin: 0;
}

---

然后，您需要相应地调整色带的“左”值。

您需要将“mainHolder”下“figure”元素的边距设置为0边距

.mainHolder figure {
    width: 200px;
    height: 200px;
    overflow: hidden;
    position: relative;
    margin: 0;
}

---

然后，您需要相应地调整色带的“左”值。

尝试从

中删除
溢出：隐藏的
。mainHolder figure
，然后调整
的
：悬停
，从而：

.mainHolder figure {
    width: 200px;
    height: 200px;
    position: relative;
}

.mainHolder figure:hover figcaption.fig22 {
    left: -140px;
    top: -15px;
}

尝试从
.mainHolder图
中删除
溢出：隐藏
，然后调整
：悬停
，以获得
figcaption.fig22
，从而：

.mainHolder figure {
    width: 200px;
    height: 200px;
    position: relative;
}

.mainHolder figure:hover figcaption.fig22 {
    left: -140px;
    top: -15px;
}

非常简单：

一,-

二,-

演示：
非常简单：

一,-

二,-

演示：
我添加了一个图像，显示我希望将图22
悬停在上方时显示的位置。我找到了它。非常感谢。我玩了CSS。我添加了一个图像来显示我希望将
图22
悬停在上方时出现的位置。我找到了答案。非常感谢。我玩过CSS。有没有办法平滑过渡滑出部分？谢谢。是的，将转换应用到顶部和左侧属性，请参阅更新的演示。在那里甚至没有看到。谢谢。有没有办法使滑出部分平稳过渡？谢谢。是的，将转换应用到顶部和左侧属性，请参阅更新的演示。在那里甚至没有看到。非常感谢。
.mainHolder figcaption.fig11 {
    left: -30px; /* change this */
    bottom: 30px; /* change this */
}
.mainHolder figure:hover figcaption.fig22 {
    left: -120px; /* change this */
    top: 30px; /* change this */
}