html - 设置<img>样式以从其HTML属性而不是CSS读取尺寸

一旦width或height属性通过CSS被篡改，如何取消这些样式并告诉图像再次从其HTML属性读取维度？
width和height的初始值是auto，但显式设置它不起作用：

img {
  height: 200px;
}

/* ... */

img {
  height: auto;
}

它只会使图像完全忽略它们的HTML属性。

最佳答案

如果您可以访问在height上设置img的初始CSS，那么对于CSS3浏览器，您可以将其修改为：

img:not([width]):not([height]) {
    height: 200px;
}

如果图像具有:not或width属性，则使用height来“不”应用它。你可以see results in this fiddle。这意味着您总是希望属性优先于上面的CSS。然后，如果您真的想通过CSS应用更改，则需要将类或其他内容应用到img，如下所示：

<img src="blah" class="specialCase" />

img.specialCase {
    height: 200px;
}

它否决了height但不否决width设置as this fiddle shows。

关于html - 设置<img>样式以从其HTML属性而不是CSS读取尺寸，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14143445/