4

这就是我得到的:

在此处输入图像描述

我希望右上角的关闭按钮是一个 X,我相信它应该是默认的。请记住,模态可以完美运行,当我单击关闭按钮 (A~-) 时,它会按预期工作。我尝试在 IE、Chrome 和 Firefox 上运行它,但在所有情况下问题仍然存在。

有任何想法吗?


<div id="group" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="groupLabel"
     aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="groupLabel">Add group</h3>
    </div>
    <div ng-controller="Ctrl">
        <form ng-submit="addGroup(newGroup, newColor); newGroup='';">
            <div class="modal-body">
                <div class="row-fluid">
                    <div class="span3 offset3">
                        Group name
                    </div>
                    <div class="span6">
                        <input class="input-block-level" type="text" ng-model="newGroup">
                    </div>
                </div>
                <div class="row-fluid">
                    <div class="span3 offset3">
                        Group color
                    </div>
                    <div class="span6">
                        <select ng-model="newColor" class="input-block-level">
                            <option value="">None</option>
                            <option value="red">Red</option>
                            <option value="blue">Blue</option>
                            <option value="green">Green</option>
                            <option value="orange">Orange</option>
                            <option value="cyan">Cyan</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                <input class="btn btn-primary" type="submit" value="Save changes">
            </div>
        </form>
    </div>
</div>

这是感兴趣的行:

<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

这些是我的包括:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script type="text/javascript" src="js/angular.js"></script>
<script type="text/javascript" src="js/controller.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/ui-bootstrap.js"></script>
<script type="text/javascript" src="js/angular-ui-if.js"></script>
<link rel="stylesheet" href="css/bootstrap/css/bootstrap.css">
4

3 回答 3

4

这是您代码中的 x :

× U+00D7 乘

什么时候应该

x U+0058 拉丁文大写字母 X

使用键盘上的那个。

于 2013-10-02T18:01:23.877 回答
1

因为您的按钮文本不是“x”。这甚至可以在此页面上看到,只需按 [ctrl]+[f] 用“x”填充搜索字段并按几次 [f3]。将在页面上找到除您的以外的所有“x”。

于 2013-10-02T18:02:14.850 回答
1

您使用的 x 不是真实的x,它是其他一些 unicode 字符。简单的解决方案是用正确编码的 x 替换它(提示:使用键盘)。

这也可能是由于缺少图标字体,其中该特殊×字符是关闭按钮图标,这意味着您需要仔细检查并确保您在 CSS 中包含字体依赖项。或者,该元素的默认 Bootstrap 字体可能是它呈现为×您看到的字符而不是 A 字符的字体,并且您在事后更改了字体。

于 2013-10-02T18:05:40.447 回答