css – 图像宽度/高度转换不起作用

在放大图像时使用转换在Chrome中似乎不起作用.

HTML：

<img src="foobar.png">

CSS：

img
        {
            float: left;
            margin-right: 10px;
            border-radius: 10px;
            width: 200px;
            -webkit-transition: width 1s ease,height 1s ease;
        }
        img:hover
        {
            width: 100%;
        }

小提琴：http://jsfiddle.net/6Dk4D/

哪里不对？

解决方法

它似乎不能与百分比一起工作.此外,如果您也希望转换高度,您需要在orignal img样式中声明它.如下所示：如果您为悬停指定宽度(以像素为单位),则为 http://jsfiddle.net/Skooljester/6Dk4D/1/.

编辑：如果指定第一个宽度为百分比,那么第二个宽度可以用百分比来定义,但仍然可以工作.谢谢Tyilo

原文地址：https://www.jb51.cc/css/217115.html