我正在尝试理解这个 code为了裁剪和居中图像。
我想我已经理解了大部分内容,但我仍然不明白为什么我需要这个:
.img-crop img{
/* removes(sorta) image from the flow */
padding-left: 100%;
margin: -100% -100%;
}
我认为 margin: -100% -100%
是为了使图像垂直和水平居中,但为什么它被放置在容器的左侧(因此:为什么我需要那个padding-left: 100%)?
最佳答案
我想我知道它是如何工作的。 here你可以找到我试图从头开始为你写的一个例子。 image
已被替换为 div
,但由于它们都显示为 inline-block
,因此最后一个便于更改高度和玩它。
如果您不想使用 jquery 大量操作所有 DOM,我可以说它非常有用!仅在一堆 css 规则集中裁剪和居中。
关于css - 了解内联 block div 及其 "margin"css 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18410499/