悬停div以动态增加其大小

Question

如何为div(卡(添加悬停，这会动态增加大小(宽度和高度(，因为我不想在介质中每次增加大小都写响应。

这不起作用：

.card:hover {
background-color: #ffd700;
width: 260px;
height: 293px; 
transition: 0.5s;
}

<div class="card">
hello
</div>

Answer 1

使用tranform:scale(1.5)缩放1.5

.card {
background-color: pink;
width: 260px;
height: 293px;
transition: 0.5s;
}
.card:hover {
background-color: #ffd700;
transform: scale(1.5);
}

<div class="card">
hello
</div>