فنون نمایش تصاویر
برای نمایش تصاویر در صفحه میتوانید از کلاس های زیر استفاده کنید.
تصاویر ریسپانسیو یا واکنش گرا
اندازه تصویر بر اساس تغییر اندازه، تغییر خواهد کرد.
LTR

RTL

<img class="fluid" src="..."/>
تصاویر بند انگشتی
برای نمایش تصاویر به صورت بندانگشتی میتوانید از کلاس های زیر سود بجویید.
LTR




RTL




<img class="thumbnail primary outline" src="..."/>
LTR



RTL



<img class="thumbnail round xxl" src="..."/>
<img class="thumbnail circle" src="..."/>
<a>
<img class="thumbnail primary" src="..."/>
<img class="thumbnail primary disabled" src="..."/>
<a/>
موقعیت
برای جابجایی تصویر در سمت خاص، میتوانید از کلاسهای زیر استفاده کنید.
LTR

RTL

<img class="start" src="..."/>
LTR

RTL

<img class="left" src="..."/>
LTR

RTL

<img class="end" src="..."/>
LTR

RTL

<img class="right" src="..."/>
LTR

RTL

<img class="center" src="..."/>
برخی از مرورگر ها از خصوصیت float: inline-start و inline-end پشتیبانی نمیکنند.