<h1> H1. Bootstrap heading </h1><p class="display-1"> Display 1 </p>نمایش 1
نمایش 2
نمایش 3
نمایش 4
<div class="bg-primary"> Landrick Saas & Software Template </div><div class="bg-soft-primary"> Landrick Saas & Software Template </div><div class="text-primary"> Landrick Saas & Software Template </div>
<div class="btn-group dropdown-primary">
<button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Primary
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Home</a>
<a class="dropdown-item" href="#">Services</a>
<a class="dropdown-item" href="#">About us</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Contact us</a>
</div>
</div>
<span class="badge bg-primary"> primary </span><span class="badge rounded-pill bg-primary"> primary </span><span class="badge bg-soft-primary"> primary </span><span class="badge rounded-pill bg-soft-primary"> primary </span><div class="alert alert-primary" role="alert"> A simple primary alert—check it out! </div><div class="alert alert-primary" role="alert"> A simple primary alert with <a href="#" class="alert-link"></a>. </div>Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.
Whenever you need to, be sure to use margin utilities to keep things nice and tidy.
<div class="alert alert-success alert-dismissible fade show" role="alert">
<strong>Well done!</strong> You successfully read this important alert message.
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"> </button>
</div>
<div class="alert alert-primary alert-pills" role="alert">
<span class="badge rounded-pill bg-danger"> New </span>
<span class="alert-content"> A Modern primary alert—check it out! </span>
</div>
<div class="alert alert-outline-primary alert-pills" role="alert">
<span class="badge rounded-pill bg-danger"> New </span>
<span class="alert-content"> A Modern primary alert—check it out! </span>
</div>
<div class="card shadow rounded border-0 overflow-hidden>
<img src="images/blog/01.jpg" class="img-fluid" alt=">
<div class="card-body">
<h5 class="card-title">Saas & Software : Landrick</h5>
<p class="text-muted mb-0">Due to its widespread use as filler text for layouts, non-readability is of great importance</p>
</div>
</div>
Due to its widespread use as filler text for layouts, non-readability is of great importance
ادامه مطلبDue to its widespread use as filler text for layouts, non-readability is of great importance
ادامه مطلب
<div class="card shadow rounded border-0 overflow-hidden>
<img src="images/blog/01.jpg" class="img-fluid" alt=">
<div class="card-body">
<h5 class="card-title">Saas & Software : Landrick</h5>
<p class="text-muted mb-0">Due to its widespread use as filler text for layouts, non-readability is of great importance</p>
</div>
</div>
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
Last updated 3 mins ago
<nav aria-label="breadcrumb" class="d-inline-block">
<ul class="breadcrumb bg-white rounded shadow mb-0">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Pages</a></lt>
<li class="breadcrumb-item active" aria-current="page">Components</li>
</ul>
</div>
<ul class="pagination mb-0">
<li class="page-item"><a class="page-link" href="javascript:void(0)" aria-label="Previous">Prev</a></li>
<li class="page-item active"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item"><a class="page-link" href="#" aria-label="Next">Next</a></li>
</ul>
<img src="images/home/01.jpg" class="img-fluid avatar avatar-ex-sm rounded">
<img src="images/home/01.jpg" class="img-fluid avatar avatar-ex-sm rounded-circle">
<div class="progress-box">
<h6 class="title text-muted"> Progress</h6>
<div class="progress">
<div class="progress-bar position-relative bg-primary" style="width:84%;">
<div class="progress-value d-block text-muted h6">84%</div>
</div>
</div>
</div>
| # | First | Last | Handle |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | Jacob | Thornton | @fat |
| 3 | هری | Potter | @hpt |
" انواع مختلفی از قسمتهای لورم ایپسوم در دسترس است، اما اکثریت آنها به نوعی دچار تغییر شدهاند، با طنز تزریقی، یا کلمات تصادفی که حتی اندکی هم باورپذیر به نظر نمیرسند. "
There are 280+ feather icons and you can get all icons info from here: https://feathericons.com/
<i data-feather="mail" class="fea icon-sm"> </i>There are 4400+ Material Design icons and you can get all icons info from here: https://materialdesignicons.com/
<i class="mdi mdi-home"> </i>There are Flaticon icons and you can get all icons info from here: https://www.flaticon.com/packs/basic-icon
There are 1100+ Iconscout (Unicons) Icons and you can get all icons info from here: https://www.flaticon.com/packs/basic-icon
<span class="h3 text-primary me-2">
<i class="uil uil-0-plus"></i>
</span>
