<!-- پاپ‌اوور پایه -->
<button type="button" class="btn mb-1 btn-primary btn-pill" data-toggle="popover" title="عنوان پاپ‌اوور"
  data-content="متن اصلی پاپ‌اوور">نمایش پاپ‌اوور</button>

<!-- پاپ‌اوور چهار جهت -->
<button type="button" class="btn mb-1 btn-info btn-pill" data-container="body" data-toggle="popover"
  data-placement="top" data-content="متن اصلی پاپ‌اوور" title="پاپ‌اوور بالا">پاپ‌اوور بالا
</button>

<button type="button" class="btn mb-1 btn-warning btn-pill" data-container="body" data-toggle="popover"
  data-placement="right" data-content="متن اصلی پاپ‌اوور" title="پاپ‌اوور سمت راست"> پاپ‌اوور سمت راست
</button>

<button type="button" class="btn mb-1 btn-danger btn-pill" data-container="body" data-toggle="popover"
  data-placement="bottom" data-content="متن اصلی پاپ‌اوور " title="پاپ‌اوور پایین">پاپ‌اوور پایین
</button>

<button type="button" class="btn mb-1 btn-dark btn-pill" data-container="body" data-toggle="popover"
  data-placement="left" data-content="متن اصلی پاپ‌اوور" title="پاپ‌اوور سمت چپ"> پاپ‌اوور سمت چپ
</button>


<!-- بستن با کلیک بعدی روی پاپ‌اوور -->
<a tabindex="0" class="btn btn-lg btn-success btn-pill" role="button" data-toggle="popover" data-trigger="focus"
  title="بستن پاپ‌اوور با کلیک روی آن" data-content="متن اصلی پاپ‌اوور">بستن پاپ‌اوور با کلیک روی آن</a>


                        

  
<!-- تولتیپ پایه -->
<button type="button" class="btn btn-primary btn-pill" data-toggle="tooltip" data-placement="right" title="متن تولتیپ">
  نمایش تولتیپ
</button>

<!-- تولتیپ چهار جهت -->
<button type="button" class="btn btn-primary btn-pill mb-4" data-toggle="tooltip" data-placement="top"  title="تولتیپ بالا">
  تولتیپ بالا
</button>
<button type="button" class="btn btn-info btn-pill mb-4" data-toggle="tooltip" data-placement="left"  title="تولتیپ سمت چپ">
  تولتیپ سمت چپ
</button>
<button type="button" class="btn btn-secondary btn-pill mb-4" data-toggle="tooltip" data-placement="bottom"  title="تولتیپ پایین">
  تولتیپ پایین
</button>
<button type="button" class="btn btn-success btn-pill mb-4" data-toggle="tooltip" data-placement="right"  title="تولتیپ سمت راست">
  تولتیپ سمت راست
</button>

<!-- بستن تولتیپ با کلیک روی آن -->
<span class="d-inline-block" tabindex="0" data-toggle="tooltip" title="متن تولتیپ">
  <button class="btn btn-primary btn-pill btn-lg" style="pointer-events: none;" type="button" disabled>دکمه غیرفعال</button>
</span>