نوارهای هدایتی
یک نوار هدایتی درواقع یک سرفصل(هدر) ناوبری می باشد که در بالای یک صفحه، قرار داده شده است.
به وسیله ی بوتسترپ، یک نوار هدایتی می تواند بر اساس اندازه ی صفحه نمایش، گسترش یابد یا نزول کند.
یک نوار هدایتی استاندارد به وسیله ی عبارت <nav class="navbar navbar-default"> ایجاد می شود.
مثال زیر نشان می دهد که چگونه، یک نوار هدایتی را به بالای یک صفحه اضافه کنیم:
مثال (گزینه نوار هدایتی)
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">نام وبسایت</a>
</div>
<div>
<ul class="nav navbar-nav">
<li class="active"><a href="#">خانه</a></li>
<li><a href="#">صفحه 1</a></li>
<li><a href="#">صفحه 2</a></li>
<li><a href="#">صفحه 3</a></li>
</ul>
</div>
</div>
</nav>
...
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">نام وبسایت</a>
</div>
<div>
<ul class="nav navbar-nav">
<li class="active"><a href="#">خانه</a></li>
<li><a href="#">صفحه 1</a></li>
<li><a href="#">صفحه 2</a></li>
<li><a href="#">صفحه 3</a></li>
</ul>
</div>
</div>
</nav>
...
خودتان امتحان کنید »
 | تمام مثال های درون این صفحه، یک نوار هدایتی را نشان خواهند داد که فضای زیادی را بر روی صفحات نمایش کوچک اشغال می کند اما نوار هدایتی در صفحات نمایش بزرگ، یک خط واحد خواهد بود-زیرا بوتسترپ واکنش گرا می باشد. این مشکل(در رابطه با صفحات نمایش کوچک) در مثال آخر این مقاله، حل خواهد شد. |
|---|
