1

Twitter Bootstrap 在 2.0 和 2.1 之间发生了一些变化，在使用令人敬畏的同位素图像库时排除了图像大小的简单规范，并要求用户使用 $(window).load 或 $container.imagesLoaded 的替代技术来正确绘制 (http: //isotope.metafizzy.co/docs/help.html）。看到的错误是指定图像的垂直高度似乎被忽略并且图像重叠。更改为等待图像加载的替代形式会在闪烁和绘画问题方面导致更糟糕的体验。我最终回到了 Bootstrap 2.0。

我确认该问题是在 2.1 的引导程序中引入的。您可以在这里找到引导程序的更改历史：https ://github.com/twitter/bootstrap/wiki/Changelog

有谁知道 2.1 中可能导致这种损坏的变化以及是否有任何好的解决方法。如上所述，等待图像加载比仅仅输入图像的高度和宽度要糟糕得多，因此这并不是真正的解决方法。

4

1 回答 1

0

我在这里发布了答案：https ://github.com/twitter/bootstrap/issues/6541

在 CSS 中内联这个工作，像这样：img src="blah-blah" width=398 height=265 style="width:398px; height:265px"

其实我也测试过Isotope，没有使用width和height属性，像这样：img src="blah-blah" style="width:398px; height:265px"

效果很好！如果最好只指定 CSS，有什么建议吗？

通过使用这个 CSS，我可以很容易地在没有 bootstrap（或 bootstrap 2.0）的情况下进行测试：img { width: auto; 高度：自动；}

似乎CSS中的宽度和高度确实覆盖了图像属性，并且在图像加载之前，浏览器不知道要分配多少空间，然后，即使在图像加载之后，间距仍然是错误的，在至少与同位素。内联样式确实解决了这个问题。我想我尝试过使用常规样式，但这似乎不起作用，但我可能遇到了 CSS 优先级问题。无论如何，由于图像大小是由图像属性决定的，所以放入这一点内联 CSS 是很自然的。我希望我们最终能找到更好的解决方案，因为这肯定会在升级时影响其他人。

或者至少应该记录一下，需要对图像的宽度和高度使用内联样式而不是属性。

于 2013-01-12T10:32:19.530 回答