jQuery UI 对话框向图像添加不需要的内联样式

Question

我正在使用 JQUery UI 作为我正在开发的 Rails 应用程序的前端。我正在使用 jQuery 对话框窗口来显示一些选项卡式数据，并且在这些选项卡之一内我想要渲染一些图像。

如果我在没有 Javascript 的情况下查看页面，图像的渲染工作正常，但是由于某种原因，当将其全部放入对话框窗口时，除了我渲染的最后一个图像之外的所有图像都会从某处获取一些内联样式!

没有对话框窗口:

        <img alt="Dsc_0085" class="picture" src="/system/sources/3/normal/DSC_0085.jpg?1260300748" />
        <img alt="Dsc_0006" class="picture" src="/system/sources/4/normal/DSC_0006.jpg?1260301612" />

带有对话框窗口:

    <img alt="Dsc_0085" class="picture" src="/system/sources/3/normal/DSC_0085.jpg?1260300748" style="height: 0px; width: 0px; border-top-width: 1px; border-bottom-width: 1px; font-size: 22px; border-left-width: 1px; border-right-width: 1px; display: inline; ">
    <img alt="Dsc_0006" class="picture" src="/system/sources/4/normal/DSC_0006.jpg?1260301612" style="display: inline; ">

我不明白为什么将图像放入对话框窗口会给它们提供高度和宽度为 0px 的内联样式，有人有什么想法吗？

Answer 1

我不知道，但您可以在 CSS 中使用 !important 覆盖它(请仔细检查 IE6)。

您还可以尝试在模态事件中添加类似 $('img.picture').removeAttr('style') 的内容。

将 display:inline 设置为内联样式非常奇怪，因为默认情况下图像是内联显示的......但我确信 UI 团队有他们的理由。