صفحه اصلی / دوره‌های آموزشی / آموزش بوت استرپ 4 از مقدماتی تا پیشرفته / آموزش کار با متن (تایپوگرافی) در بوت استرپ 4

آموزش کار با متن (تایپوگرافی) در بوت استرپ 4

آموزش کار با متن  (تایپوگرافی) در بوت استرپ 4
براي خريد اين درس نياز است وارد سايت شويد. در صورت نداشتن حساب کاربري عضو شويد.
رایگان

جلسات دوره


                       
مهدی عباسی
مدرس:

مهدی عباسی

18 سال سابقه برنامه‌نویسی و تدریس برنامه‌نویسی
کسب مقام‌های اول و دوم کشوری در مسابقات برنامه‌نویسی

مهدی عباسی هستم، مسلط به حداقل ۲۰ زبان مطرح برنامه نویسی به صورت پیشرفته، مدیر عامل شرکت آریا نرم افزار و بنیانگذار آکادمی درسمن، مسلط به تدریس دروس تخصصی کاردانی و کارشناسی کامپیوتر، پایگاه داده ها، برنامه نویسی پیشرفته، مبانی برنامه نویسی، مباحث ویژه طراحی وب و .... مشاهده رزومه

آموزش کار با متن (Text) و تایپوگرافی در bootstrap 4 :

در این بخش از آموزش، درادامه مبحث grid system ها با کلاس های no-gutters و order آشنا می شوید و همچنین به معرفی کلاس های، کار با متن و فونت در bootstrap 4 پرداخته ایم.
کلاس های مربوط  به کار با متن و تایپو گرافی :
کلاس های آماده شده توسط بوت استرپ هستند که برای استایل دهی و کنترل کردن متن و فونت استفاده می شوند. شامل کلاس های زیر می باشند:

 

  • Text-left : متن را از سمت چپ تراز می کند.
  • Text-right : متن را از سمت راست تراز می کند.
  • Text-center : متن را از وسط  تراز می کند.
  • Text-justify : متن را از سمت چپ  و راست تراز می کند.
  • Text-nowrap : ازشکسته شدن متن جلوگیری می کند.

کار با متن در بوت استرپ 4 - سر ریز متن از کادر

 

  • Text-truncate :   از بیرون رفتن متن از کادر جلوگیری می کند و تا اتهای کادر شما متن را نشان می دهد و اگر متن شما بیشتر از محدوده کادر باشد آن را نمایش نمی دهد و با علامت (...) متن را خاتمه می دهد.

Text-truncate در بوت استرپ 4 - جلوگیری از بیرون رفتن متن

 

  • Text-capitalize : حروف اول هر کلمه را به حروف بزرگ تبدیل می کند.

بزرگ کردن حروف اول متن در بوت استرپ 4

 

  • Text-lowercase : متن را به حروف کوچک تبدیل می کند.

تبدیل متن به حروف کوچک در بوت استرپ 4

 

  • Text-uppercase : متن را به حروف بزرگ تبدیل می کند.

تبدیل متن به حروف بزرگ در بوت استرپ 4

 

  • Text-break : در صورت طولانی بودن متن، آن را شکسته و زیر هم نمایش می دهد.
  • Text-monospace : عرض حروف یک کلمه یا متن را به صورت یکسان تنظیم می کند.
Text break در بوت استرپ
 
 
 
 
 
 
 
 
 
 
 

 

 

 

  • Text-reset : رنگ یک متن یا پیوند را تنظیم می کند. (از‌‌‌‌‌ ‌والد خود به ارث می برد)
  • Text-decoration-none : خط زیر یک کلمه را حذف می کند. مانند خط  لینک

 

  • Font-weight : وزن فونت را مشخص می کند. 
  1. Font-weight -lighter
  2. Font-weight -light
  3. Font-weight -normal
  4. Font-weight -bold
  5. Font-weight -bolder
  6. Font –italic 

Font-weight در بوت استرپ - وزن متن


امیدواریم که این آموزش، برای شما دوستان درسمنی عزیز مفید باشد،
برای یادگیری این مبحث می توانید این درس را خریداری کنید و از فایل ها و ویدئو این بخش استفاده کنید.
درصورت سوال و یا مشکل می توانید به انجمن پرسش و پاسخ درسمن مراجعه کنید. پیشنهادات و انتقادات خود را در بخش نظرات برای ما ارسال کنید.smiley

انجمن برنامه نویسان وب

نظرات دانشجویان

نظر شما در تصمیم دیگران اثرگذار است.

لطفا برای همراهان درسمن و بهتر شدن دوره نظر خود را بنویسید.

برای ارسال نظر نیاز است وارد سایت شوید. در صورت نداشتن حساب کاربری عضو شوید.
ثبت نام

279