Source

Jumbotron

សមាសធាតុស្រាល និងអាចបត់បែនបានសម្រាប់បង្ហាញខ្លឹមសាររចនាប័ទ្មអង្គភាពវីរបុរស។

សមាសធាតុដែលអាចបត់បែនបានទម្ងន់ស្រាល ដែលអាចពង្រីកច្រកទិដ្ឋភាពទាំងមូលជាជម្រើស ដើម្បីបង្ហាញសារទីផ្សារសំខាន់ៗនៅលើគេហទំព័ររបស់អ្នក។

សួស្តី​ពិភពលោក!

នេះគឺជាឯកតាវីរៈបុរសសាមញ្ញ ដែលជាសមាសធាតុរចនាប័ទ្ម jumbotron សាមញ្ញសម្រាប់ការហៅការយកចិត្តទុកដាក់បន្ថែមចំពោះខ្លឹមសារ ឬព័ត៌មានដែលមានលក្ខណៈពិសេស។

វាប្រើថ្នាក់ឧបករណ៍ប្រើប្រាស់សម្រាប់ការវាយអក្សរ និងគម្លាតទៅមាតិកាដកឃ្លាចេញពីក្នុងធុងធំ។

ស្វែង​យល់​បន្ថែម 
<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>
  <a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a>
</div>

ដើម្បីធ្វើឱ្យ jumbotron ពេញទទឹង និងដោយគ្មានជ្រុងមូល សូមបន្ថែម .jumbotron-fluidថ្នាក់កែប្រែ ហើយបន្ថែម a .containerឬ .container-fluidខាងក្នុង។

សារធាតុរាវ jumbotron

នេះគឺជា jumbotron ដែលបានកែប្រែដែលកាន់កាប់ចន្លោះផ្ដេកទាំងមូលនៃមេរបស់វា។

<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>