جامبۆترۆن
پێکهاتەیەکی سووک و نەرم و نیان بۆ پیشاندانی ناوەڕۆکی شێوازی یەکەی پاڵەوان.
پێکهاتەیەکی سووک و نەرم و نیان کە دەتوانێت بە ئیختیاری تەواوی دەرچەی بینین درێژ بکاتەوە بۆ پیشاندانی پەیامە سەرەکییەکانی بازاڕکردن لە ماڵپەڕەکەتدا.
سڵاو جیهان!
ئەمە یەکەیەکی پاڵەوانی سادەیە، پێکهاتەیەکی سادەی شێوازی جامبۆتڕۆنە بۆ بانگهێشتکردنی سەرنجی زیاتر بە ناوەڕۆک یان زانیارییە تایبەتمەندەکان.
پۆلەکانی سوودبەخش بۆ تایپۆگرافی و دووری بەکاردەهێنێت بۆ ئەوەی ناوەڕۆک لەناو دەفری گەورەتردا بۆشایی بکات.
<div class="jumbotron">
<h1 class="display-4">Hello, world!</h1>
<p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
<hr class="my-4">
<p>It uses utility classes for typography and spacing to space content out within the larger container.</p>
<p class="lead">
<a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a>
</p>
</div>
بۆ ئەوەی جامبۆترۆنەکە تەواو پان بێت، و بەبێ گۆشەی گوڵاو، .jumbotron-fluid
پۆلی دەستکاریکەر زیاد بکە و a .container
یان .container-fluid
لەناو زیاد بکە.
جامبۆترۆنی شلە
ئەمە جامبۆترۆنێکی دەستکاریکراوە کە تەواوی فەزای ئاسۆیی دایک و باوکی داگیر دەکات.
<div class="jumbotron jumbotron-fluid">
<div class="container">
<h1 class="display-4">Fluid jumbotron</h1>
<p class="lead">This is a modified jumbotron that occupies the entire horizontal space of its parent.</p>
</div>
</div>