css3 scale 卡

CSS3中的scale属性可以让我们方便地缩放元素的大小，而不用改变元素的位置。

对于卡片的实现，我们可以使用CSS3中的scale属性来实现hover状态下的卡片放缩效果。

首先，我们需要给卡片加上一个鼠标悬浮效果：

.card:hover{
    transform: scale(1.1);
}

上面的代码意思是，当鼠标悬浮在卡片上方时，将卡片的大小放大到原来的1.1倍。这样可以让卡片更加突出。

但是，在使用scale属性时，需要注意不要让卡片的内容溢出。因此，我们需要对卡片进行适当的调整：

.card{
    width: 300px;
    height: 200px;
    padding: 20px;
    border: 1px solid #ccc;
    Box-shadow: 0 0 10px rgba(0,.1);
    transition: all .3s ease;
    overflow: hidden;
}

上面的代码中，我们通过设置卡片的宽度、高度和内边距，来避免卡片内容的溢出。同时，我们还给卡片添加了一个Box-shadow属性，使其有一些视觉效果。

最后，我们用一个完整的CSS代码来实现我们的卡片效果：

.card{
    width: 300px;
    height: 200px;
    padding: 20px;
    border: 1px solid #ccc;
    Box-shadow: 0 0 10px rgba(0,.1);
    transition: all .3s ease;
    overflow: hidden;
}
.card:hover{
    transform: scale(1.1);
}

通过上面的CSS代码，我们就可以实现一个简单的卡片放缩效果了。