តួលេខ

គ្រប់ពេលដែលអ្នកត្រូវការបង្ហាញខ្លឹមសារមួយ - ដូចជារូបភាពដែលមានចំណងជើងជាជម្រើស សូមពិចារណាប្រើ <figure>.

ប្រើថ្នាក់ដែលបានរួមបញ្ចូល .figureនិង .figure-imgដើម្បី .figure-captionផ្តល់នូវរចនាប័ទ្មមូលដ្ឋានមួយចំនួនសម្រាប់ HTML5 <figure>និង <figcaption>ធាតុ។ រូបភាពនៅក្នុងតួរលេខមិនមានទំហំច្បាស់លាស់ទេ ដូច្នេះត្រូវប្រាកដថាបន្ថែម .img-fluidថ្នាក់ទៅរបស់អ្នក <img>ដើម្បីធ្វើឱ្យវាឆ្លើយតប។

<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

ការតម្រឹមចំណងជើងរូបភាពគឺងាយស្រួលជាមួយ ឧបករណ៍ប្រើប្រាស់អត្ថបទ របស់យើង ។

<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption text-end">A caption for the above image.</figcaption>
</figure>

សាស

អថេរ

$figure-caption-font-size:          $small-font-size;
$figure-caption-color:              $gray-600;