Question

我正试图将图像定位在确定的高度。

就像这张主图片一样：

我有这个：

HTML

<div class="present100">
<img id="imagem" src="teste.jpg" />
</div>

CSS

.present100 {
    width: 100%;
    height: 620px;
    background-color: #333;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    margin: auto;
}

#imagem {
    position: relative;
    width: 100%;
    min-width: 1300px;
    min-height: 100%;
}

我不知道如何在调整大小时将图像居中，就像http://littlelines.com/

一样

Answer 1

不确定为什么你在.present100元素上有绝对位置，但你必须绝对定位图像

#imagem {
    position: absolute;
    width: 100%;
    min-width: 1300px;
    min-height: 100%;

    left:50%;
    top:50%;

        -ms-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}

http://jsfiddle.net/gaby/vMyvc/

演示

图像位于确定高度的中心位置

1 个答案: