缩放CSS中生成的内容

Question

如何缩放添加的图像:在CSS之前或之后？

例如,我有一个包含书籍封面的页面:

<span class="book">
    <img src="http://ecx.images-amazon.com/images/I/41t7xMPK%2B6L.jpg" />
</span>

我想使用CSS使它看起来更像一本书,而不仅仅是一本封面.我可以使用:之前添加第二张图片来做这件事,但由于所有书的大小各不相同,我需要能够缩放此图像以适应书籍封面.

我试过了

.book:before{
    content:url("/images/book.png");
    position:absolute;
    height:100%;
    width:100%;

}

但这在缩放图像时不起作用.

Answer 1

你可以扩展它:

transform: scale(0.7);

但它不适用于px或%.

Answer 2

尝试将它们的 amin-height和 a设置max-height为相同的值，然后它应该将图像缩放到正确的尺寸，同时保持正确的宽高比。（并根据宽度执行此操作，具体取决于您要缩放的宽度）