3

我有一张图片:

<img src="my_image.png"/>

我希望它分别增加它的宽度和高度,但原点应该从中心开始。因为一般当图像大小增加时,原点在左上角。

4

4 回答 4

2

您好,您可以通过display:table-cell; vertical-align:middle;&得到您想要的结果text-align:center;请参阅以下代码:-

您可以根据您的要求增加宽度和高度图像将出现在中心。

HTML

<div id="parent">
      <img src="http://dummy-images.com/abstract/dummy-107x160-RedDots.jpg" />
    </div>

CSS

#parent {
    display:table-cell;
    width : 700px;
    height : 400px;
    background-color: black;
    vertical-align:middle;
    text-align:center;
}

演示:- http://tinkerbin.com/IZxFN8cH

于 2012-08-30T12:14:30.767 回答
0

这是你想要的吗?

http://jsfiddle.net/4yR8M/

CSS:

#container {
    width: 300px;
    height: 300px;
    line-height: 300px;
    text-align: center;
    background: #123;    
}

#container img {
    width: 100px;
    vertical-align: middle;
}

html:

<div id="container">
    <img src="your/image/url"/>
</div>
于 2012-08-30T12:21:11.027 回答
0

我认为 image origin 的意思是——有些人说它是 pivot 。它就像一个重心。当我们增加图像宽度时,增加图像的左上角保持不变并且宽度向右上角增加,相同的高度向底部增加,

他想从中心增加高度和宽度,而不是从 RHS 或底部我认为最终的解决方案是使用 JQuery

于 2012-08-30T12:23:23.413 回答
0

使用:变换:缩放();

示例 :transform:scale(1.1);

于 2019-09-16T05:11:55.097 回答