我正在使用 Bootstrap 5 開發一個小型網站。當我使用 Firefox 中的開發工具測驗移動部分時（選擇了 iPhone 12/13）。
這反而打破了早期的界限。當然“558/”應該適合。當我在我的 Iphone 12 上嘗試它時，它似乎并不關心容器右側的填充來確定單詞 break。
這是它在我手機上的樣子：
在 Firefox Iphone 12/13 的開發工具中它看起來（并且應該看起來）如下：
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" />
<div id="content-container" class="container-xxl mx-auto p-4 bg-white">
<main>
<div class="row p-xl-4">
<div class="container">
<div class="mb-5 col-sm-12 col-md-8 p-4" style="border: 2px solid red">
www.trrrrrrrrrr.co.uk/rrrrrrr/558/rrrwwwwrrrrr-rrrrrr
</div>
</div>
</div>
</main>
</div>我該如何調整它以使其正確中斷？
uj5u.com熱心網友回復：
text-break在 div 上添加類
<div class="text-break mb-5 col-sm-12 col-md-8 p-4" style="border: 2px solid red">
www.trrrrrrrrrr.co.uk/rrrrrrr/558/rrrwwwwrrrrr-rrrrrr
</div>
或者添加自定義 css
.classname{word-break: break-all;}
希望這對你有用
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/521279.html
標籤：css推特引导
上一篇：不懂Linux命令