Question

我有一张图片：

<img src="my_image.png"/>

我希望它分别增加它的宽度和高度，但原点应该来自中心。因为通常当图像尺寸增加时，原点位于左上角。

Answer 1

您好，您可以通过display:table-cell; vertical-align:middle;＆amp;获得所需的结果。 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

Answer 2

这就是你想要的吗？

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>

Answer 3

我认为形象起源意味着 - 有些人说它转动了。它就像一个重力中心。当我们增加图像宽度时，增加图像的左上角保持不变，宽度朝右角增加，同样的高度朝向底部增加，

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

Answer 4

使用：transform：scale（）;

示例：transform：scale（1.1）;

如何增加图像的宽度/高度，原点保持居中

4 个答案: