单选按钮在IE7中显示不正确但在Firefox中可以正常显示?

时间:2009-10-22 14:29:13

标签: css internet-explorer-7 transparency radio-button

我的网站设置在ie8和firefox中运行正常但是你可以在这里看到:

alt text

这是一个css或png透明度的问题吗?或者这只是IE7的内容。

提前致谢:)

3 个答案:

答案 0 :(得分:4)

我不确定这是否是您遇到的现象,但它看起来确实如此,所以:

单选按钮是< input>标签像任何其他。如果你有一个适用于所有输入标签的CSS规则,它们将激活单选按钮(并提交按钮和复选框等)以及输入文本字段。具有讽刺意味的是,IE尤其臭名昭着。

我倾向于使用以下类型的HTML代码段:

<input type="radio" class="radio" ... />

然后定义我的CSS规则:

input {
  // stuff for most input fields goes here, e.g.
  background-image:url(fancy.png);
}
input.radio {
  // reverting the rules I don't want applied, e.g.
  background-image:none;
}

虽然这并没有使用花哨的选择器,就像人们可以争辩的那样,但它确实与传统浏览器具有出色的兼容性,特别是IE6(只要Windows 2000仍然在使用,它可能不会从互联网太快了。)

答案 1 :(得分:1)

对于有类似问题的人来说,解决这个问题的方法是添加

background-image: none;

收音机按钮的css :)希望有所帮助。

答案 2 :(得分:0)

我有IE 9,我的asp RadioButtonList上有白色方形背景,如下所示:

<asp:RadioButtonList ID="RadioListSearchScope" runat="server" TextAlign="Right" >
<asp:ListItem Text="Include Thread & Inquiry Keywords" selected="true" Value="0"></asp:ListItem>
<asp:ListItem Text="Include Thread & Inquiry Title Text" Value="1"></asp:ListItem>
<asp:ListItem Text="Include Inquiry & Response Body Text" Value="2"></asp:ListItem>
<asp:ListItem Text="Search All the Above" Value="3"></asp:ListItem>

这在Chrome,FireFox等中看起来很好。这是通过在RadioButtonList HTML控件中没有CssClass属性解决的,记住这是作为type = radio的输入呈现,然后将其添加到我的全局CSS样式表:

    input[type="checkbox"] {
        background: transparent;
        border: inherit;
        width: auto;
    }
    input[type="radio"] {
        background: transparent;
        border: inherit;
        width: auto;
    }

这似乎治愈了单选按钮!文字是O K - 但是小按钮&#39;无论怎样,都有大约20x20px的区域是白色的。这是好的,直到背景是白色以外的东西!

我希望有所帮助!