嘿，我找到问题所在啦！你的CSS里hover选择器的写法有个小错误，导致放大效果没触发。

问题原因 #

你写的 .row__poster :hover 中间多了一个空格——这个空格会让浏览器把它解析成后代选择器，意思是只对.row__poster内部的子元素生效，但我们要的是图片元素本身被hover时放大，所以必须去掉这个空格，改成 .row__poster:hover。

修正后的完整代码 #

.row__posters { display: flex; }
.row__poster { 
  object-fit: contain; 
  width: 100%; 
  max-height: 100px; 
  margin-right: 0.6em; 
  transition: transform 450ms; 
}
/* 去掉空格，直接绑定到.row__poster元素本身 */
.row__poster:hover { transform: scale(1.08); }

<div class="row">
 <h2>Heading</h2>
 <div class="row__posters">
 <img class="row__poster" src="https://www.allaboutbirds.org/news/wp-content/uploads/2020/03/tricolored-heron-dorian-anderson-texas-124505431-1800-1280x853.jpg" alt="bird" />
 <img class="row__poster" src="https://www.allaboutbirds.org/news/wp-content/uploads/2020/03/tricolored-heron-dorian-anderson-texas-124505431-1800-1280x853.jpg" alt="bird" />
 </div>
</div>

这样修改后，鼠标悬停在图片上时，就会触发transform: scale(1.08)的过渡动画，实现平滑的放大效果啦～

内容的提问来源于stack exchange，提问作者Jemshith T K