Bootstrap Jumbotron文本溢出问题
文字从大屏幕中溢出。 
遵循引导文档中的 jumbotron 示例，无法弄清楚为什么格式无法容纳其中的文本巨型屏幕。
<div class="jumbotron jumbotron-fluid ">
<div class="container ml-4 mr-3 mb-4">
<img align='center' src="{{ url_for('static', filename='product_pics/' + product.product_image)}}" alt="...">
<h1 >{{ product.title }}</h1>
<h5>Created by: {{product.author.username}}</h5>
<h6>Published: {{ product.date.strftime('%B %d, %Y') }}</h6>
<p class="lead">{{product.text}}</p>
{% if product.author == current_user %}
<div>
<a class="btn btn-secondary" href="{{ url_for('products.update', product_id=product.id) }}">Update</a>
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#del_modal">Delete</button>
</div>
{% endif %}
</div>
</div>
Text overflows out of jumbotron.
Followed the sample of jumbotron from the bootstrap documentation, not able to figure out why the formatting cannot fit text within jumbotron.
<div class="jumbotron jumbotron-fluid ">
<div class="container ml-4 mr-3 mb-4">
<img align='center' src="{{ url_for('static', filename='product_pics/' + product.product_image)}}" alt="...">
<h1 >{{ product.title }}</h1>
<h5>Created by: {{product.author.username}}</h5>
<h6>Published: {{ product.date.strftime('%B %d, %Y') }}</h6>
<p class="lead">{{product.text}}</p>
{% if product.author == current_user %}
<div>
<a class="btn btn-secondary" href="{{ url_for('products.update', product_id=product.id) }}">Update</a>
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#del_modal">Delete</button>
</div>
{% endif %}
</div>
</div>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
尝试将
text-wrap添加到＆lt; p＆gt;类。Try adding
text-wrapto the<p>class.