Html 具有固定宽度的多个div的转换

在我的页面上动态创建了数百个div，因为它们在npx中具有不同的固定宽度

F.e.一对夫妇：

<div class='show' style='width:121px'></div>
<div class='show' style='width:13px'></div>
<div class='show' style='width:58px'></div>

等等

在我的css中，我尝试进行以下转换：

<style type="text/css">
.show {
  float: left;
  background: rgba(120,120,120,0.5);
  transition: width 2s, height 2s;
  -webkit-transition: width 2s, height 2s;
}
.show:hover {
  width:300px;
  height:200px;
}
</style>

当然，这对高度很有效，但对宽度无效，因为它是固定的

即使使用固定的宽度，也能让效果继续吗？

---

如果没有，你能告诉我该如何解决这个问题吗？

你可能会被黑客攻击，用它来编写你的CSS规则！重要：

但更好的方法是使用jQuery将它们作为目标，但如果动态添加这些div，则使用等待它们加载到DOM中的事件来实现

$('.show').css('width', '300px');

---

内联样式总是最可取的。您可以使用JS来更改它们，但我建议首先使用线外样式CSS块或文件。

$('.show').css('width', '300px');