خلاصه مطالب Utilites : 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای استفاده از خاصیت border  در عناصرمون از کلاس هاس border / border-top / border-bottom / border -left

border-right همچنین برای حذفی دادن یعنی به ی قسمت فقط ندیم هم از کلاس‌های border-0 / border-top-0 border-bottom-0 /  border-left-0 / border-right-0 همچنین برای دادن رنگ به آن‌ها کافیست بعد از border  از کلاس‌های رنگی با نام‌های  primary / secondary / success / danger /warning / info / light / dark / white با استفاده از یک - بهش بدهیم

همچنین برای گرد کردن border هم از کلاس هایی زیر استفاده میکنیم rounded / rounded-0 /rounded -top 

rounded -left / rounded -right /rounded -circle / rounded -bottom

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* clear-fix برای قرار گرفتن درست المان هامون موقعی که میایم و از خاصیت‌های float  استفاده میکنیم به المان هامون این کلاس رو میدهیم همچنین برای استفاده از فلوت‌ها هم میتوانیم از کلاس float-none / float-right / float-left

و یا این که به صورت شرطی از اون‌ها استفاده کنیم float-md-left 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* close icon 

<button type="button" class="close" aria-label="Close">
  <span aria-hidden="true">&times;</span>
</button>

-----------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای دادن رنگ به المان هامون کافی است بیایم و از کلاس‌های رنگی border استفاده کنیم با این تفاوت که به جای استفاده از border-  از text-  برای متن‌ها و از -bg  برای بک گراند هامون استفاده بکنیم

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای دادن display به المان هامون در ابتدا سه کلاس با نام‌های d-inline و d-block و d-none داریم همچنین می‌توانیم به صورت شرطی نیز بیایم و استفاده نیز بکنیم  d-none d-sm-block و  d-none d-lg-block d-xl-none 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* embeds برای اضافه کردن یک فایل ویدیویی یا صوتی یا یک تگ ویدیو به کد هامون هستش که جون ما بیشتر برای نمایش ویدیو‌ها میایم و از پلیر‌های جاوااسکریپتی یا تگ ویدیو html استفاده میکنیم زیاد کاربردی نیستش این تگ

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* استفاده از کلاس text-hide  برای موقعی هستش که ما یک متن داریم ولی میخاهیم به جای متن از تصویر استفاده بکنیم

<h1 class="text-hide" style="background-image: url('/docs/4.1/assets/brand/bootstrap-solid.svg'); width: 50px; height: 50px;">Bootstrap</h1>

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* استفاه از این سه کلاس برای این هستش که در هنگام انتخاب کردن متن‌ها به 3 صورت عدم انتخاب  انتخاب جمله و انتخاب کلمه رو استفاده بکنیم  user-select-all و  user-select-auto  و user-select-none 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای استفاده از فلکس در داخل بوت استرپ در ابتدا کافی است به المان هامون بیایم و کلاس‌های d-flex / d-inline-flex

و یا هم به صورت شرطی d-md-flex  و بقیه ویژگی‌های فلکس هم با نام پراپرتی و مقدارش می‌توانیم استفاده بکنیم مثلا 

justify-content-center 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای استفاده از سایه‌ها shadow  هم ما به طور کلی 4 تا کلاس داریم با نام‌های shadow / shadow-none / shadow-lg / shadow-sm 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای تبدیل کردن مثلا کارد هامون به صورت یک اینک برای ارجاع داده شدن کافیست بیایم و در تگ a اصلی  کلاس Stretched link  بدهیم  که محدوده کلیک رو به پرنت یا والدش هم میدهد

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای استفاد از پوزیشن‌های مختلف میتوانیم از کلاس‌های زیر بیایم و استفاده بکنیم position-fix / fix-top /

 fix-bottom  / position-static / position-relative / position-absolute  / position-sticky sticky-top

------------------------------------------------------------------------------------------------------------------------------------------------------------------

*   برای مبحث سایز‌ها در داخل بوت استرپ ما برای عرض‌ها چهارتا کلاس درصدی داریم w-25 / w-50 / w-75 / w-100

h-25 / h-50 / h-75 / h-100 و همچنین مقادیر auto  هم داریم و کلاس‌های ماکسیمم و مینیم هم استفاده بکنیم

mh-100 / mw-100 همچنین میتوانیم بیایم و از viewport  ها هم استفاده بکنیم با نام‌های vh-100 و vw-100 و 

min-vw-100  و  max-vw-100 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای استفاده از overflow در المان هامون هم میتوانیم از کلاس‌های over-flow-auto  و  over-flow-hidden  استفاده بکنیم 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

* برای فاصله گزاری‌ها هم ما در بوت یکسری کلاس برای مارچین‌ها و پدینگ‌ها داریم  

mx px my py  mr ml mt mb  که از -1 تا -5 میگیرد و مقادیر اون بر اساس مقادیر rem هستش که به صورت .25 بالا میرود و برای منفی دادن هم باید از -n1  تا -n5  استفاده بکنیم و با استفاده از auto  هم میتوانیم از وسط چین کردن‌ها هم استفاده بکیم مثلا mx-auto  وسط چپ و راست المان پدر قرارش میدهد

------------------------------------------------------------------------------------------------------------------------------------------------------------------

- کلاس‌های متن برای align  کردن متن هامون که کلاس‌های text-justify و text-right و text-left و text-center و text-sm-left و..

- برای استفاده از خاصیت overflow از دو تا کلاس با نام‌های text-wrap و text-nowrap رو در داخل متن‌های ما کنترل میکند

- کلاس word-wrap کلمه یا کلاس رو وقتی جا نمی‌شد میومد میشکوند و مینداخت لاین بعدی کلاس text-break میاد و کل جمله رو میشکونه و میندازه لاین بعدی 

- برای تبدیل و کار با حروف انگلیسی که سه تا کلاس با نام‌های text-lowercase و text-uppercase و text-capitalize

- برای کار کردن و زخیم کردن فونت هامون که کلاس هایی با این عنوان font-weight-bold و font-weight-bolder و font-weight-normal و font-weight-light و font-weight-lighter و font-italic

- کلاس text-reset  برای این هستش که میاد و رنگ متن‌های مارو به صورت ارث بری از والدش به ارث می‌برد 

- برای تراز کردن المان هامون هستش align-baseline / align-top / align-middle / align-bottom / align-text-top

 align-text-bottom  که همان استفاده از خاصیت vertical-align  هستش 

- برای نمایش و عدم نمایش یک المان یا به عبارت visibility  المان هامون می‌توانیم از کلاس‌های  .visible  .invisible. استفاده بکنیم