我想將元素連續放在導航選單中，所以我使用了 bootstrap 5.0 行類，但它們仍然一個在另一個之下。我正在做一個 Flask 專案，所以我在某種程度上使用了 Jinja。
base.html
<body>
<div class = "container">
{% block body %}
{% endblock %}
</div>
</body>
面板.html
{% block body %}
<nav class="navbar sticky-top">
<div class="fixed-top" style="width: 100%; max-width: 100%; height: 100px; background-color: #2E2E2E;">
<nav class="container-wide navbar navbar-expand-lg">
<div class = "row">
<a id="rbf-main" style="font-size:40px" href= "{{ url_for ('home') }}">RBF</a>
<a class ="rbf-link" href= "{{ url_for ('home') }}">Remove more Big Files</a>
</div>
</nav>
</div>
</nav>
{% endblock %}
uj5u.com熱心網友回復：
行中的元素必須獲得“col-”類。Bootstrap 基于 12 列布局，因此如果您想將 rbf-main 和 rbf-link 放在一行中，它們都應該有這樣的類。
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"/>
<div class = "row">
<a class="col-12 col-sm-6" id="rbf-main" style="font-size:40px" href= "{{ url_for ('home') }}">RBF</a>
<a class="col-12 col-sm-6 rbf-link" href= "{{ url_for ('home') }}">Remove more Big Files</a>
</div>元素以視口大小 sm 共享一行。您可以使用任何其他視口大小。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/517000.html
標籤：htmlcss引导程序 5