در جلسه قبل در مورد مبحث گرید سیستم و breakpoint توضیح دادیم. breakpointها در واقع ساختاری هستند، که تعیین کننده سایز دستگاه های مختلف می باشند و براساس دستگاهها و سخت افزارهای مختلف که ما معمولا در اختیار داریم، تقریبا در 5 دسته دستگاههایی را که میتوانند صفحات وب را نشان دهند در اختیار داریم، که در مورد سایزهای مختلف آن صحبت کردیم. در این جلسه ابتدا چند مثال دیگر را در مورد این مبحث باهم بررسی میکنیم وسپس با مفهموم utility در بوت استرپ 4 آشنا میشوید.
Utility: کلاس های آماده ایی هستند که بوت استرپ در اختیار ما قرار داده است، که به راحتی میتوانیم از آنها استفاده کنیم و همچنین باعث میشوند سرعت کد نویسی و استایلدهی به سایت بیشتر شود.
آشنایی با دو نوع از utilityها در بوت استرپ 4:
Color: کلاس color برای تعیین رنگ متن و پس زمینه استفاده میشود.
کلاس های Text-color (رنگ متن):
کلاس های background-color (رنگ پس زمینه):
Border: کلاس border برای ایجاد یا حذف حاشیه استفاده میشود.
border: برای ایجاد یک border به اندازه 1px میباشد.
border-color: برای تعیین رنگ border از کلاس های زیر استفاده میکنیم:
border add :(L,R,T,B) برای اضافه کردن border به در جهتهای مختلف از کلاسهای زیر استفاده میکنیم: مثلا یک شی تنها border سمت راست داشته باشد.
border-top: یک border قسمت بالا یک شی اضافه میکند.
border-bottom: یک border قسمت پایین یک شی اضافه میکند.
border-left: یک border سمت چپ یک شی اضافه میکند.
border-right: یک border سمت راست یک شی اضافه میکند.
border remove: برای حذف border از کلاس های زیر استفاده می کنیم:
rounded: برای ایجاد radius یک شی (گردی گوشههای یک شی) از کلاسهای زیر استفاده میکنیم:
برای یادگیری این مبحث مثالها و نکتههای متعددی را در فایل ویدئویی آوردهایم که با تهیه این درس و مشاهده ویدئوها به طور کامل به این مبحث مسلط خواهید شد.
امیدواریم که این آموزش، برای شما دوستان درسمنی عزیز مفید باشد، درصورت سوال و یا مشکل میتوانید به انجمن پرسش و پاسخ درسمن مراجعه کنید. پیشنهادات و انتقادات خود را در بخش نظرات برای ما ارسال کنید.