CSS 如何删除模态中的x按钮?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/25183303/
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
How to remove x button in modal?
提问by lowcoupling
is there any way to remove the closing button (x) in the upper right corner of a modal? The reason why i need it is that the modal contains a mandatory form and I do not want the user to escape from it.
有没有办法删除模态右上角的关闭按钮(x)?我需要它的原因是模式包含一个强制性的形式,我不希望用户逃避它。
OoopsI didn't realize the close button was actually explicitly added in the code i pasted
哎呀我没有意识到关闭按钮实际上是在我粘贴的代码中明确添加的
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
I though it was an attribute of the modal. Sorry
我虽然这是模态的一个属性。对不起
回答by Zim
You can remove the close
button markup, and use the data-backdrop="static"
and data-keyboard="false"
attributes to prevent the user from closing it...
您可以删除close
按钮标记,并使用data-backdrop="static"
和data-keyboard="false"
属性来防止用户关闭它...
回答by paulalexandru
Since this is the code for x button:
因为这是 x 按钮的代码:
<button data-dismiss="modal" class="close" type="button">
<span aria-hidden="true">×</span>
<span class="sr-only">Close</span>
</button>
Just use this css:
只需使用这个css:
.close {display: none;}
回答by Gautam
From code of Bottstrap modal window
来自 Bottstrap 模态窗口的代码
<div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
Remove the Line from above Code
从上面的代码中删除行
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
I think it's Helped you for removing close button
我认为这有助于您删除关闭按钮
回答by NuOne
I looked for components inside the modal which belongs to .close
class then set css property to none
我在模态中寻找属于.close
类的组件,然后将 css 属性设置为 none
id of the modal is myModalId
模态的 id 是 myModalId
function hideCloseButton(){
// get the close button inside the modal
$('#myModalId .close').css('display', 'none');
}
// finally call the method
hideCloseButton();
回答by Jorge Santos Neill
I deleted the input type button and the solution work for me, the code removed was:
我删除了输入类型按钮,解决方案对我有用,删除的代码是:
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>