Html 如何在ul、li标签中保持img元素的纵横比？

当用户使用手机时，图像会失真，宽度会改变，但高度不会改变

我不确定我到底应该改变什么，我试着增加一个最大高度，但这似乎不像我想的那样有效

我还想指出，我正在使用CSS引导

<ul style="position: absolute; max-width: 625px; list-style-type: none; margin: 0 auto;" class="username">';
  <li style="list-style-type: none; margin:0; padding:0;">
    <img style="height: 360px" class="img-thumbnail" src="filename" />
  </li>
</ul>

---

似乎您只是在定义高度，请尝试将其更改为：

<ul style="position: absolute; max-width: 625px; list-style-type: none; margin: 0 auto;" class="username">';
  <li style="list-style-type: none; margin:0; padding:0;">
    <img style="height: 360px; width: 360px (or however wide your image is)" class="img-thumbnail" src="filename">
  </li>
</ul>

---

此外，自动关闭标签在HTML5中不再有效，因此我也删除了该标签，只需更改一个维度，并将另一个设置为自动，如：

width:150px;
height:auto;

---

它仍然会被扭曲。另外，我忘了提到我正在使用CSS引导。是的，我试过了。它仍然会被扭曲。另外，我忘了提到我正在使用CSS引导。