Source

តួលេខ

ឯកសារ និងឧទាហរណ៍សម្រាប់បង្ហាញរូបភាព និងអត្ថបទដែលពាក់ព័ន្ធជាមួយធាតុផ្សំនៃរូបភាពនៅក្នុង Bootstrap ។

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

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

៤០០x៣០០
ចំណងជើងសម្រាប់រូបភាពខាងលើ។
<figure class="figure">
  <img src=".../400x300" class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

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

៤០០x៣០០
ចំណងជើងសម្រាប់រូបភាពខាងលើ។
<figure class="figure">
  <img src=".../400x300" class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
  <figcaption class="figure-caption text-right">A caption for the above image.</figcaption>
</figure>