引导程序 4 H2 标签不会在单独的行中显示标头

我正在使用引导程序 4。当我用标题标签(h1，h2，h3...(编写标题时，标题应该显示在一行中。发生的情况是下一个内容与标题标签一起显示，没有换行符。可能是什么原因？

我已确保标题标签正确关闭

<div class="row">    <h2>Expertise</h2>    <p>Php, html5, css3, wordpress, </p>    </div>

预期输出应如上

但它的显示如下所示。所有内容都以不同的字体大小在 1 行中。专业知识大于 REST 内容。

专业知识 Php， html5， css3， wordpress，

添加列以在行中添加内容，如下所示

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<div class="container">
    <div class="row">
        <div class="col">
            <h2>Expertise</h2>
            <p>Php, html5, css3, wordpress, </p>
        </div>
    </div>
</div>

引导 4 网格系统规则

使用行创建水平列组
内容应放置在列中，并且只有列可以是行的直接子级

参考： https://www.w3schools.com/bootstrap4/bootstrap_grid_system.asp

这是因为包含

display：flex的类"row"。如果要使用row，则应用css "flex-direction" ： column。它将把 h2 带到下一行。

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<body>
  <div class="">
    <h2>Expertise</h2>
    <p>Php, html5, css3, wordpress, </p>
  </div>
</body>

相关内容

最新更新

热门标签：