0

بلاگ

باحد > آموزش بوت استرپ (Bootstrap ) > تایپوگرافی بوت استرپ bootstrap

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

آگوست 4, 2019
ارسال شده توسط
آموزش بوت استرپ (Bootstrap )
752 بازدید

مقالات

تنظمات پیش فرض

تنظیمات پیش فرض بوت استرپ bootstrap 4

bootstrap 4 بصورت پیش فرض از font-size:16 و line-height:1.5 استفاده می کند.

font-family بوت استرپ 4 بصورت پیش فرض  “Helvetica Neue”, Helvetica, Arial, sans-serif. می باشد.

این ویژگی ها در <body> و تمامی عنصر element های <p> یا همان پاراگراف های صفحه به کار رفته است.

تمام عناصر <p> یک حاشیه پایین دارند که نصف خط ارتفاع آنها محاسبه می شود (به طور پیش فرض 10px).

بوت استرپ و بوت استرپ پیش فرض

در این بخش ما با برخی ویژگیها بوت استرپ-bootstrap آشنا خواهیم شد که با تنظیمات پیش فرض مرورگرها کمی تفاوت دارد.

<small>

در بوت استرپ عنصر – المنت small برای ایجاد یک متن سبک تر و ثانویه در هر عنوان استفاده می شود:

<mark>

عنصر <mark> در html بوت استرپ bootstrap نوشته را بصورت زیر استایل دهی می کند.

Use the mark element to highlight text.t

دستور کد: <mark>نوشته<mark>

<abbr>

عنصر <abbr> در html بوت استرپ bootstrap نوشته را بصورت زیر استایل دهی می کند.

The WHO was founded in 1948.

<blockquoe>

عنصر <blockquote> در html بوت استرپ bootstrap نوشته را بصورت زیر استایل دهی می کند.

از این عنصر برای ایجاد نقل قول در بوت استرپ استفاده می شود.

برای نمایش نقل قول در سمت راست از کلاس .blockquote-reverse استفاده کنید.

<dl>

عنصر <dl> در html بوت استرپ bootstrap نوشته را بصورت زیر استایل دهی می کند.

<code>

عنصر <code> در html بوت استرپ bootstrap نوشته را بصورت زیر استایل دهی می کند.

<kdb>

عنصر <kdb> در html بوت استرپ bootstrap نوشته را بصورت زیر استایل دهی می کند.

Use ctrl + p to open the Print dialog box.

<pre>

عنصر <pre> در html بوت استرپ bootstrap نوشته را بصورت زیر استایل دهی می کند.

رنگ متنی و پس زمینه

بوت استرپ – bootstrap نیز دارای برخی از کلاس های متنی است که می تواند برای “معنی دادن از طریق رنگ ها” استفاده شود.کلاس های رنگ متن عبارتند از: .text-muted، .text-primary، .text-success، .text-info، .text-warning، و .text-danger:

کلاس های رنگ پس زمینه: .bg-primary، .bg-success، .bg-info، .bg-warning، و .bg-danger:

کلاس های تایپوگرافی

دیگر کلاس های تایپوگرافی typography بوت استرپ-bootstrap

کلاس های رنگ پس زمینه: .bg-primary، .bg-success، .bg-info، .bg-warning، و .bg-danger:

توجه:رنگ ها و استایل ها فعلا در سایت قابل مشاهده نیست لطفا به سایت bootstrap مراجعه فرمایید.

کلاسهای تایپوگرافی بیشتر

کلاس های بوت استرپ زیر را می توان به عناصر سبک HTML اضافه کرد:

.lead یک پاراگراف را برجسته می کند

.                                                                                                                                                                                                                                                                                                                                                                      متن کوچکتر را نشان می دهد (تنظیم به 85 درصد از اندازه پدر و مادر)

.text-left نشانگر متن چپ گرا است

.text-center نشان دهنده متن محور مرکزی است

.text-right نشان می دهد متن راست تراز شده

.text-justify متن موجه را نشان می دهد

.text-nowrap بدون متن را تعریف می کند

.text-lowercase متن کوچکتر را نشان می دهد

.text-uppercase متن بزرگتر را نشان می دهد

.text-capital را نشان می دهد متن بزرگ شده

.initialism متن را در یک عنصر <abbr> در یک اندازه کوچکتر نشان می دهد

.list-unstyled  حذف لیست سبک پیش فرض و حاشیه چپ در مورد لیست (در <ul> و <ol> کار می کند). این کلاس فقط برای اقلام لیست فوری کودکان (برای حذف سبک پیش فرض لیست از هر لیست توزیع شده، اعمال می شود و این کلاس را به هر لیست توزیع نیز اعمال می کند)

.listlist-inline همه موارد را در یک خط لیست قرار می دهد

.dl-horizontals خطوط را از شرایط (<dt>) و توصیف (<dd>) در <dl> عناصر

.pre-scrollable یک عنصر <pre> scrollable را ایجاد می کند

5/5 - (1 امتیاز)

مطالب زیر را حتما مطالعه کنید

1 دیدگاه

به گفتگوی ما بپیوندید و دیدگاه خود را با ما در میان بگذارید.

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