Question

我使用＆＃34;溢出：隐藏;＆＃34;图像上的CSS属性，但我希望它能切断图像的顶部而不是底部。有没有办法做到这一点？

Answer 1

您可以通过以下方式实现它：

使用图片代码：

HTML

<div class="img">
    <img src="http://lorempixel.com/600/400/sports/1/" />
</div>

CSS：

.img {
    position:relative;
    width:600px;
    height:300px;
    overflow:hidden;
}
.img img {
    position:absolute;
    bottom:0;
}

使用背景图片

HTML：

<div class="bg"></div>

CSS：

.bg {
    width:600px;
    height:300px;
    background-image:url(http://lorempixel.com/600/400/sports/1/);
    background-size:100%;
    background-position:bottom right;
    background-repeat:no-repeat;
}

演示：http://jsfiddle.net/lotusgodkk/GCu2D/475/

CSS：make＆＃34; overflow：hidden＆＃34;隐藏顶部而不是底部？

1 个答案: