对于某些模式,我使用屏幕右上角的“x”按钮关闭模式。虽然按钮可用于较大的设备(当宽度大于768像素时),但我发现该按钮在较小的设备(例如手机上)上无法使用。Bootstrap模式关闭按钮不适用于较小的屏幕
这是我使用的关闭按钮,我直接下了引导文件的HTML:
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span class="close-btn" aria-hidden="true">
×
</span>
</button>
我还添加了类close-btn
更改为字体大小2.5 EM使其变大。
编辑:下面是完整的模式:
<div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-content">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span class="close-btn" aria-hidden="true">×</span></button>
<div class="row">
<div class="col-lg-12">
<div class="modal-body">
<h2 class="text-center">Title here.</h2>
<hr class="star-primary">
<h3 class="text-center">
Text here.
</h3>
<br />
</div>
</div>
</div>
</div>
</div>
尝试加入模态的整个代码错误可能是包含该按钮的股利。 –
您是否包含bootstrap.js文件? –
@RidoanSalehNasution是的,我将它包含在'
'中。 – Lyxpudox