css - Internet Explorer 和 Border around Image IN iFrame

标签 css internet-explorer stylesheet image

所以我正在尝试修复我正在处理的网站的一些 css 问题,除了 1 个 iFrame 元素外,一切看起来都差不多。

iFrame 包含一张随机生成的图片,以及一个您单击后会将您重定向到另一个页面的按钮。所有功能都有效,只是样式。无论我尝试什么,我都无法删除嵌入在 iFrame 元素中的 img 标签周围的 2px 边框。在我放入 iFrame 的实际页面上,所有 3 个浏览器中的图像周围都没有边框,因此出于某种原因,当 img 标签位于主页上的 iFrame 中时,IE 想要在此 img 标签上放置另一个边框...

这是嵌入在主页中的 iFrame。

<iframe src="~/Photos/PhotoViewer.aspx" runat="server" scrolling="no" frameBorder="0" class="PhotoViewer"></iframe>

这是CSS类

.PhotoViewer
{
    height: 200px;
    width: 100%;
    margin-left: 0px;
    outline: 0px;
    border:none;
    outline:none;
}

这是嵌入页面的一部分

.noBorder
{
    border:none;
    outline:none;
}
</style>
</head>
<body>
<form runat="server" class="noBorder" style="margin:0px;">
    <asp:HyperLink runat="server" NavigateUrl="~/Photos/Default.aspx" Target="_parent" class="noBorder"><img id="randPhoto" runat="server" alt="Photo Unavailable" class="noBorder"/></asp:HyperLink>
    <div style="border:none">
        <asp:Button runat="server" ID="btnUploadPhoto" OnClick="btnUploadPhoto_Click" class="button" style="border:none"/>
    </div>
</form>
</body>

我已尝试使用我能在本网站上找到的大多数建议,例如:

a, img {border:none;}
img {border:none;}

我使用了 IE (F12) 的 css 调试功能,我发现即使我将所有这些 border: none/border: 0px 放在 img 周围,它仍然会在它周围放置一个 2px 的边框。如何将 css 样式强制应用到 iFrame 内的 img 元素上?

最佳答案

尝试将嵌入式页面中的 CSS 更改为此;

.noBorder img
{
border:none;
outline:none;
}

关于css - Internet Explorer 和 Border around Image IN iFrame,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11418224/

相关文章:

css - 在我的 wordpress 模板中链接到我的 CSS,css 文件在模板的同级文件夹中

css - 预编译 Assets 后,Rails 不编译开发中的样式表

html - SB Admin 2 Navbar 在删除一些内容后不再折叠

html - 如何在 Shiny 和 Shinydashboard 中自定义 HTML 文本和 verbatimTextOutput 之间的空间

css - 不同大小图标的相等填充

html - IE11 输入类型 ="file"accept =".xls"附加类别出现

html - CSS3 : Chevron-side banner has aliased edges

javascript - 为 IE 优化 jQuery

javascript - 在 IE 中中止表单发布

html - 如何使fieldset动态扩展和压缩