手机上的引导模式宽度较小(宽度)

Question

我正在处理一个使用Bootstrap 4并使用模式窗口显示一些信息的页面。它在台式机/笔记本电脑/平板电脑上运行良好，但当我在手机上测试时，模态打开，但宽度非常窄。当手机上显示时，我是否应该考虑一些东西来增加模态的宽度。

模式的代码示例

<div class="modal fade" id="workwith">
<div class="modal-dialog modal-lg">
<div class="modal-content"> 

<!-- Modal Header -->
<div class="modal-header">
<h4 class="modal-title">WTitle</h4>
<button type="button" class="close" data-dismiss="modal">&times;</button>
</div>

<!-- Modal body -->
<div class="modal-body">
<ul>
<li class="li-item"><a href="https://xxxx" target="_blank">xxxx</a></li>
<li class="li-item"><a href="https://xxxx" target="_blank">xxxx</a></li>
</ul>

<div class="pic_frame_right">
<img src="img/pics/three_pis2.png"> </div>
</div>
<!-- Modal footer -->
<div class="modal-footer">
<button type="button" class="btn btn-dark" data-dismiss="modal">Close</button>
</div>
</div>
</div>

引导导航

<nav class="navbar navbar-dark bg-dark navbar-expand-sm sticky-top"> 
<button class="navbar-toggler"  data-toggle="collapse" data-target="#menu1">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="menu1"> 
<!-- Links -->
<ul class="navbar-nav nav-fill w-100">
<li class="nav-item"> <a class="nav-link" data-toggle="modal" data-target="#workwith">Facilities</a> </li>
</ul>
</div>
</nav>

Answer 1

刚刚找到原因，我将css模态lg设置为最大宽度=60%