Bootstrapطراحی سایت

آموزش بوت استرپ (تایپوگرافی ها،متن ها)

آموزش بوت استرپ 4 قسمت 1 (تایپوگرافی ها،متن ها)

آموزش بوت استرپ.از آنجایی که بوت استرپ دارای کلاس های آماده css برای طراحان سایت میباشد به طور حتم میتوان گفت که کار کاربران خود را در بخش تایپوگرافی ها و متن ها بسیار  آسان کرده است .

آموزش bootstrap در عنوان ها

همه عناوین html ، مانند <h1> و ….. در بوت استرپ دردسترس هستند.که با کلاس های .h1 .h2 .h3 .h4 .h5 .h6 میتوان از آنها به صورت زیر استفاده کرد:

مثال:

آموزش بوت استرپ

عنوان صفحه با متن کمرنگ

مثال:

بوت استرپ

display.

وقتی برای برجسته کردن به عنوان نیاز دارید ، میتوانید از کلاس های     display  استفاده کنید.

مثال:

متن ها در بوت استرپ

lead.

با افزودن .lead میتوانید یک متن را برجسته کنید

مثال:

<small>

در bootstarp میتوانید از تگ <small> برای ایجاد متن سبک تر و فرعی در یک عنوان استفاده کنید.

مثال:

<mark>

با تگ <mark> میتوانید متنی را با رنگ زرد و مقداری padding ایجاد کنید.

مثال:

بوت استرپ

Blockquote.

هنگام نقل قول از منبع دیگر میتوانید از .blockquote در تگ <blockquote>استفاده کنید.

مثال:

تایپوگرافی بوت استرپ

<dl>

تگ مذکور در bootstarp مانند مثال زیر استایل میدهد

مثال:

<kbd>

تگ مذکور در bootstarp مانند مثال زیر استایل میدهد

مثال:

آموزش بوت استرپ-کلاسهای تایپوگرافی بیشتر:

کلاس های bootstarp زیر را میتوانید در عناصر html استفاده کنید :

.font-weight-bold
.font-weight-bolder
.font-italic
.font-weight-light
.font-weight-lighter
.font-weight-normal
برجستگی متن با bootstarp
.text-right
.text-left
.text-justify
.text-nowrap
.text-center
تراز متن در بوت استرپ

list-unstyled.

در مقاله های بعد با کلاس های بیشتری از آموزش بوت استرپ آشنا خواهید شد برای یادگیری bootstarp حتما مقاله بعدی رو مطالعه کنید.

برای یادگیری عکس ها در بوت استرپ بر روی لینک کلیک کنید

مهدی صالحی

مهدی صالحی هستم برنامه نویس فرانت اند و توسعه دهنده اپ موبایل ؛ از تخصص هایی که من توی این دنیای برنامه نویسی کسب کردم میشه به : html&css , bootstrap , Sass , Flexbox , Javascript , jquery , React js , Vue js , React native , pwa اشاره کرد.

دیدگاهتان را بنویسید

دکمه بازگشت به بالا