ಮುಖ್ಯ ವಿಷಯಕ್ಕೆ ತೆರಳಿ ಡಾಕ್ಸ್ ನ್ಯಾವಿಗೇಶನ್‌ಗೆ ತೆರಳಿ
Check
in English

ಅಂಕಿ

ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್‌ನಲ್ಲಿ ಫಿಗರ್ ಕಾಂಪೊನೆಂಟ್‌ನೊಂದಿಗೆ ಸಂಬಂಧಿತ ಚಿತ್ರಗಳು ಮತ್ತು ಪಠ್ಯವನ್ನು ಪ್ರದರ್ಶಿಸಲು ದಾಖಲೆ ಮತ್ತು ಉದಾಹರಣೆಗಳು.

ಈ ಪುಟದಲ್ಲಿ

ಐಚ್ಛಿಕ ಶೀರ್ಷಿಕೆಯೊಂದಿಗೆ ಚಿತ್ರದಂತಹ ವಿಷಯದ ತುಣುಕನ್ನು ಪ್ರದರ್ಶಿಸಲು ನೀವು ಯಾವಾಗ ಬೇಕಾದರೂ, ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ <figure>.

HTML5 ಮತ್ತು ಅಂಶಗಳಿಗಾಗಿ ಕೆಲವು ಬೇಸ್‌ಲೈನ್ ಶೈಲಿಗಳನ್ನು ಒದಗಿಸಲು ಒಳಗೊಂಡಿರುವ .figure, .figure-imgಮತ್ತು ತರಗತಿಗಳನ್ನು ಬಳಸಿ. ಅಂಕಿಗಳಲ್ಲಿನ ಚಿತ್ರಗಳು ಯಾವುದೇ ಸ್ಪಷ್ಟವಾದ ಗಾತ್ರವನ್ನು ಹೊಂದಿಲ್ಲ, ಆದ್ದರಿಂದ ಅದನ್ನು ಸ್ಪಂದಿಸುವಂತೆ ಮಾಡಲು ನಿಮ್ಮ ವರ್ಗವನ್ನು ಸೇರಿಸಲು ಮರೆಯದಿರಿ..figure-caption<figure><figcaption>.img-fluid<img>

Placeholder 400x300
ಮೇಲಿನ ಚಿತ್ರಕ್ಕೆ ಶೀರ್ಷಿಕೆ.
html
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

ಆಕೃತಿಯ ಶೀರ್ಷಿಕೆಯನ್ನು ಜೋಡಿಸುವುದು ನಮ್ಮ ಪಠ್ಯ ಉಪಯುಕ್ತತೆಗಳೊಂದಿಗೆ ಸುಲಭವಾಗಿದೆ .

Placeholder 400x300
ಮೇಲಿನ ಚಿತ್ರಕ್ಕೆ ಶೀರ್ಷಿಕೆ.
html
<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;