Home  >  Article  >  Web Front-end  >  bootstrap modal box plus scroll bar

bootstrap modal box plus scroll bar

藏色散人
藏色散人Original
2020-11-20 10:34:183377browse

How to add scroll bars to the bootstrap modal box: first open the corresponding code file; then set the property to ".modal-content {overflow: auto;max-height:300px;}".

bootstrap modal box plus scroll bar

Recommendation: "bootstrap basic tutorial"

Bootstrap modal box adding scroll bar (level one)

The code is as follows:

/*不使用页面的滚动条*/
/*css:
给模态框设置overflow-y: hidden;即为取消掉页面滚动条的使用*/
#HelpModal{margin-top: 95px;height: 300px;overflow-y: hidden;}
/*添加滚动条*/
.modal-content {overflow: auto;max-height:300px;}
/*html:模态框最外层设置id属性的overflow-y: hidden;,权重值高于自定义的.modal-open .modal类名设置的overflow-y: auto;*/
<div class="modal fade" id="HelpModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

The above is the detailed content of bootstrap modal box plus scroll bar. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn