如何在不同视口引导程序中对齐文本

Answer 1

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"/>

<p class="text-lg-left text-md-center text-sm-center"> 2020 copyright, All rights reserved. </p>
<quote>Bootstrap v4.3.1 is required, v4.5.3 is recommended</quote>

引导程序

您的类应该位于“p”标签内。

<p class="text-left">Left aligned text on all viewport sizes.</p>
<p class="text-center">Center aligned text on all viewport sizes.</p>
<p class="text-right">Right aligned text on all viewport sizes.</p>

<p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
<p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p>
<p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p>
<p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>

Answer 2

要按照您提到的顺序对齐文本，请使用：

<p class="text-right text-md-center text-lg-left">Something</p>