html - 为什么 Bootstrap 5 在 span 标签后添加换行符?

标签 html css line-breaks bootstrap-5

有人提出了与此类似的问题,但它们没有解决该问题的一个非常简单的示例。给出下面的代码,如果使用 Bootstrap 5,将在结束跨度标记后添加换行符。对于普通 HTML、HTML5 或使用早期版本的 Bootstrap 时,情况并非如此。有谁知道 Bootstrap 5 中的哪些变化导致了这种情况?

我可以通过使用 style="display:inline"将跨度和后续文本包装在一个段落中来轻松解决这个问题,但我对此问题非常好奇。

<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="c2a0adadb6b1b6b0a3b282f7ecf2ecf3" rel="noreferrer noopener nofollow">[email protected]</a>/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">


<!-- HTML -->
<div class="container" style="width: 100%; height: 100%; border-style: none;">
  <div class="row" style="border-style: solid;">
    <span style="font-weight: bold">Editing User #</span>2, david
  </div>
</div>

最佳答案

这是因为你将它放在中,没有

<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="93f1fcfce7e0e7e1f2e3d3a6bda3bda2" rel="noreferrer noopener nofollow">[email protected]</a>/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">


<!-- HTML -->
<div class="container" style="width: 100%; height: 100%; border-style: none;">
  <div class="row" style="border-style: solid;">
    <div class="col">
    <span style="font-weight: bold">Editing User #</span>2, david
    </div>
  </div>
</div>

关于html - 为什么 Bootstrap 5 在 span 标签后添加换行符?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67910042/

相关文章:

html - Visual Studio/Chrome 不更新 HTML/Typescript

css - RTL 在网页上用破折号反转数字

Ruby 或正则表达式去除多余的换行符

html - css 垂直对齐 <li> 中的 img 和文本(多行)

javascript - Jquery 图像循环问题

javascript - html 或 js - 在页面中创建大量类似的 html 标签

javascript - 将类分配给中央 block

c# - 在文本换行的字符串中插入换行符?

html - 最小高度未按预期工作

css - 组织多个 CSS 代码的更好方法?