javascript与css如何做当鼠标指到对应的图片之后，该图片变大？

Question

<div class="circle_inner">

                    <div>

                        <img alt="" src="/ehouse/img/item/tourism/circle1.png" > <img

                            alt="" src="/ehouse/img/item/tourism/circle2.png">

                    </div>

                    <div>

                        <img alt="" src="/ehouse/img/item/tourism/circle3.png"> <img

                            alt="" src="/ehouse/img/item/tourism/circle4.png">

                    </div>

                </div>

.circle_inner img:hover{

    width:250px;

    height:250px;

    cursor: pointer;

    

}

如何设置图片中心位置不变呀？
关键是定位，加了效果之后，就挤压变形了？