twitter-bootstrap 从 twitter bootstrap modal 中移除模态页脚
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15611921/
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
Remove modal footer from twitter bootstrap modal
提问by Snehal Ghumade
I want to remove the footer from my modal. But it is only removing the contents and not the space acquired by it.
我想从我的模态中删除页脚。但它只是删除内容，而不是它获得的空间。
Here is my code...
这是我的代码...
<div class="modal hide fade">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">× </button>
<h3>Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
</div>
回答by Dam Fa
If you don't use '<div class="modal-footer">' in your modal template then bootstrap will made it for you. I think this is why you see the footer with your code.
My solution is hidding the footer in the template (last line) :
如果您不在<div class="modal-footer">模态模板中使用“ ”，则引导程序将为您制作。我认为这就是为什么您会看到带有代码的页脚。我的解决方案是在模板中隐藏页脚（最后一行）：
<div class="modal hide fade">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">× </button>
<h3>Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer" style="display:none"></div>
</div>
回答by Umair ul Hassan
Try this
试试这个
<div class="modal-footer" hidden="true"></div>
<div class="modal-footer" hidden="true"></div>
回答by Magus
I'm pretty sure the "extra space" is the <p>margin. Try this css :
我很确定“额外空间”就是<p>边距。试试这个 css ：
.modal .modal-body p {
margin-bottom: 0;
}
回答by Salman
I think its because of the padding given to modal-footerclass. Try overriding it
我认为这是因为给modal-footer班级提供了填充。尝试覆盖它
.modal .modal-footer {
padding: 4px;
}
I have kept it as 4pxto preserve round corners
我保留它4px以保留圆角
回答by Manoj
You can override modal-header, modal-footer of the bootstrap modal.
您可以覆盖 bootstrap modal 的 modal-header、modal-footer。
Add the following code.
添加以下代码。
.modal-footer{display: none;}
回答by SagarPPanchal
This can be achievable using jQuery
这可以使用 jQuery 实现
require(
[
'jquery',
'Magento_Ui/js/modal/modal'
],
function(
$,
modal
) {
var options = {
type: 'popup',
responsive: true,
innerScroll: true,
buttons: []
};
$('#approvalsModal').modal(options,{
closed: function(){
// Do some action when modal closed
}
});
$(".approvalsModal").click(function(){
$("#approvalsModal").modal('openModal');
});
}
);
