为什么图像会调整大小？

Question

我在我的网站kilovat.co中使用了wordpress主题。在那里我放了90x90像素。

但如图所示，图像缩小到284x284像素

我不希望图像调整大小。我猜一些CSS风格使得这个大小调整。但我找不到哪一个。我怎样才能让图像保持原样？

Answer 1

问题出在slideshow.css的第133行：

#top .slideshow li img{
  width: 100%; /* this line affects image size */
  height:auto;
  position: relative;
  z-index: 3;
  border:none;
  margin:0;
  padding:0;
  display:block;
}

您可以在浏览器中轻松调试。

我使用Chrome，但它应该与Firefox非常相似。当我浏览页面时，我右键单击图像，然后选择“检查元素”。这将打开一个包含大量信息的窗格。

在右侧，有一个“匹配CSS规则”部分，显示上面的CSS信息，以及定义它的文件名和行号。此外，许多复选框允许我禁用我想要的任何规则。通过停用width: 100%规则，我可以轻松确认width: 100%行是问题。

Answer 2

使用Chrome检查元素时，您会看到此计算样式：

width: 283.6166687011719px;

指向slideshow.css，第132行，它会覆盖您的内联样式：

#top .slideshow li img - 100%