如何使用CSS转换size()，但要使元素在悬停时浮动在其他HTML元素上

qv7cva1a 于 2023-03-20 发布在其他

关注(0)|答案(1)|浏览(115)

所以我想做的基本上是下面的图像。我想使悬停时的div元素调整大小，并在所有其他元素之上，而不移动它们。

我想象中的代码：

div {
    display: flex;
}

div .childDivs {
    width: 15rem;
    height: 15rem;
}

div .childDivs:hover {
    transform: scale(1.01);
}

<div>
    <div class="childDivs"></div>
    <div class="childDivs"></div>
    <div class="childDivs"></div>
    <div class="childDivs"></div>
    <div class="childDivs"></div>
    <div class="childDivs"></div>
    <div class="childDivs"></div>
</div>

css

来源：https://stackoverflow.com/questions/75726693/how-to-use-css-transform-size-but-to-element-float-over-other-html-elemts-on-h

1条答案

按热度按时间

krcsximq1#

你已经很接近了，你的比例需要大于1.01，虽然，这是一个很小的增加，很难发现。

.cards {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    margin: 2em;
}

.cards>div {
    width: 5rem;
    height: 5rem;
    background: cyan;
    border-radius: 1rem;
    transition: 0.2s;
}

.cards>div:hover {
    transform: scale(1.5);
    background: pink;
}

<div class="cards">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>

赞(0）回复(0）举报 2023-03-20

我来回答

如何使用CSS转换size()，但要使元素在悬停时浮动在其他HTML元素上

1条答案

相关问题

热门标签

最新问答