twitter-bootstrap 在 Bootstrap Modal 的右侧设置关闭图标
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27896563/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Set close icon on right side of Bootstrap Modal
提问by Iqbal hossain
I am using the Twitter-Bootstrap Modal currently, and I need to close an icon on the right-hand side of the header. I tried to use CSS to set it, but it didn't work.
我目前正在使用 Twitter-Bootstrap Modal,我需要关闭标题右侧的图标。我尝试使用 CSS 来设置它,但是没有用。
The code:
代码:
<div class="modal-content json-modal-body" id="full-width" ng-controller="projectdetailsController" close="CloseModal()">
<div class="modal-header modal-header-confirm">
<h4 class="modal-title ng-binding">
<span class="glyphicon glyphicon-indent-left"></span>{{modalOptions.headerText}}
<a title="Close"><i ng-click="CloseModal()" class="glyphicon glyphicon-remove icon-arrow-right"></i></a>
</h4>
</div>
<div class="modal-body">
<pre class="Modal-pre" ng-bind-html="modalOptions.bodyText"></pre>
</div>
</div>
The CSS that I tried to use:
我尝试使用的 CSS:
.icon-arrow-right {
float: right;
}
回答by Prashanth R
<div class="modal-content json-modal-body" id="full-width" ng-controller="projectdetailsController" close="CloseModal()">
<div class="modal-header modal-header-confirm">
<h4 class="modal-title ng-binding">
<span class="glyphicon glyphicon-indent-left"></span>{{modalOptions.headerText}}
<a title="Close"><i ng-click="CloseModal()" class="glyphicon glyphicon-remove icon-arrow-right pull-right"></i></a>
</h4>
</div>
<div class="modal-body">
<pre class="Modal-pre" ng-bind-html="modalOptions.bodyText"></pre>
</div>
</div>
Just add a pull-right to the class to make the element appear right. The above code should work
只需向类添加一个 pull-right 即可使元素正确显示。上面的代码应该可以工作

