IE9中带方角的引导按钮答案

【问题标题】：Bootstrap buttons with square corners in IE9IE9中带方角的引导按钮
【发布时间】：2013-09-04 16:11:09
【问题描述】：

我真的把头发扯下来了。我正在尝试制作一个相当简单的页面，其中包含一些文本、两个单选按钮和一个提交按钮。到目前为止，它在 Firefox 和 Chrome 中看起来不错，但在 IE9 中，提交按钮有方角：

当我查看 Bootstrap 网站上的示例页面时，按钮的角都是正确的圆角，所以这一定是我正在做的事情，而不是 IE 的问题。我就是不知道是什么。

<div class="container">
<div class="jumbotron">
    <div class="container">
        <h1>The welcome page.</h1>
        <p>Welcome to our page. Please select one of the options below and press 'Submit'.</p>
        <form>
          <div class="form-inline">
            <div class="radio">
                <input checked="" id="1-1" name="1" value="opt1" type="radio">
                    <label for="opt1">Option 1</label>
                <input id="1-2" name="1" value="opt2" type="radio">
                    <label for="opt2">Option 2</label>
            </div>
            </div>
          <input class="btn btn-lg btn-primary" value="Submit" type="submit">
        </form>
    </div>
</div>

这是一个演示：http://bootply.com/78669

更新：这可能有助于缩小范围。当我从 IE9 中的新位置加载页面时，提交按钮看起来应该是这样的：

...但我收到“IE 限制此页面运行脚本或 ActiveX 控件”消息。如果我单击以允许被阻止的内容，那就是按钮角变成方形的时候。

【问题讨论】：

作为一个快速修复你可以使用这个：jquery.malsup.com/corner
您是在标准模式下运行 IE 9 还是将其设置为模拟 IE 8 等？

标签： css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

Internet Explorer（版本 9 以下）本身不支持圆角。

有一个神奇的脚本会神奇地为您添加它：CSS3 PIE。剩下的你会弄清楚的。

【讨论】：

【解决方案2】：

问题在于您的 IE 9 设置，我目前正在运行 IE 9 并且角落是圆角的。确保检查您的开发人员选项 (F12) 并查看您是否正在运行

BROWSER MODE: IE 9 and DOCUMENT MODE: IE9 STANDARDS

Find a screenshot showing these options at the top right here.

【讨论】：

文档模式设置为“怪癖”，但不幸的是，将其设置为 IE9 标准并没有解决问题。我只能认为这一定与 Internet/Intranet 安全设置有关。
不能与这些有任何关系，它只是 CSS，尝试删除您添加的任何样式，例如 btn-lg，因为这不是本机引导程序。
他们已将版本 3 的 btn-large 名称更改为 btn-lg。我尝试通过并删除尽可能多的 css，问题似乎是我正在链接到引导程序-主题.css。删除该链接，一切正常。谢谢！
@patabongo 很高兴为您提供帮助。

【解决方案3】：

Internet Explorer（版本 9 以下）本身不支持圆角。

有一个神奇的脚本会神奇地为你添加它：http://css3pie.com。希望你能弄清楚其余的。

【讨论】：

我不会打扰脚本。 IE 用户不会停止在几个方角使用您的网站。继续前进，完成您的网站。
令人困惑的是，我使用的是版本 9！我已在问题中添加了更多信息。
您可能是对的 marflar，但在一个如此简单的网站上，当我无法正确显示其中一个元素时，我会担心。
问题说他正在运行 IE 9。

【解决方案4】：

按照评论者 Ryan McDonough 的建议，我浏览了文件并尽可能多地删除了 css，然后发现了问题。这是：

<link href="css/bootstrap-theme.min.css" rel="stylesheet" type="text/css">

删除引导主题的链接，一切正常。

【讨论】：