تایپوگرافی

سرفصل های اساسی

تمام عناوین HTML،<h1> through <h6>, are available.

.h1 through .h6 classes are also available, for when you want to match the font styling of a heading but cannot use the associated HTML element.

سرفصل 1

سرفصل 2

سرفصل 3

سرفصل 4

سرفصل 5
سرفصل 6

از کلاس های کاربردی گنجانده شده برای بازسازی متن عنوان ثانویه کوچک استفاده کنید

عنوان نمایش فانتزیWith faded secondary text

پیوندها

لینک ها پیش فرض دارندcolor and underline applied. While links change on :hover, they don’t change based on whether someone :visited the link. They also receive no special :focus styles.

این یک لینک نمونه است

پیوندهای نگهدارنده مکان - آنهایی که بدونhref—are targeted with a more specific selector and have their color and text-decoration reset to their default values.

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

مسابقه

برای نقل قول بلوک های محتوا از منبع دیگری در سند شما. <blockquote class="blockquote"> around any HTML as the quote.

یک نقل قول شناخته شده، موجود در یک عنصر blockquote.

یک نقل قول شناخته شده، موجود در یک عنصر blockquote.

یک نقل قول شناخته شده، موجود در یک عنصر blockquote.

مشخصات HTML مستلزم آن است که انتساب blockquote خارج از آن قرار گیرد<blockquote>. When providing attribution, wrap your <blockquote> in a <figure> and use a <figcaption> or a block level element (e.g., <p>) with the .blockquote-footer class. Be sure to wrap the name of the source work in <cite> as well.

در صورت نیاز از ابزارهای متنی برای تغییر تراز نقل قول خود استفاده کنید.

لیست ها

پیش فرض را حذف کنیدlist-style and left margin on list items (immediate children only). این فقط در مورد موارد فوری فهرست کودکان اعمال می شود, meaning you will need to add the class for any nested lists as well.

  • این یک لیست است.
  • کاملاً بدون استایل به نظر می رسد.
  • از نظر ساختاری، هنوز یک لیست است.
  • با این حال، این سبک فقط برای عناصر کودک فوری اعمال می شود.
  • لیست های تو در تو:
    • تحت تأثیر این سبک قرار نگرفته اند
    • همچنان یک گلوله نشان خواهد داد
    • و حاشیه چپ مناسب داشته باشد
  • این ممکن است هنوز هم در برخی شرایط مفید باشد.

گلوله های یک لیست را بردارید و مقداری نور اعمال کنیدmargin with a combination of two classes, .list-inline and .list-inline-item.

  • این یک آیتم فهرست است.
  • و یکی دیگر.
  • اما آنها به صورت درون خطی نمایش داده می شوند.

اختصارات

پیاده سازی تلطیف شده از HTML<abbr> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations have a default underline and gain a help cursor to provide additional context on hover and to users of assistive technologies.

اضافه کردن.initialism to an abbreviation for a slightly smaller font-size.

attr

HTML

نمایش سرفصل ها

عناصر عنوان سنتی به گونه‌ای طراحی شده‌اند که بهترین عملکرد را در محتوای صفحه شما داشته باشند. display heading- یک سبک عنوان بزرگتر و کمی با نظر بیشتر.

نمایشگر 1

نمایش 2

نمایش 3

نمایشگر 4

نمایشگر 5

نمایشگر 6

رهبری

با اضافه کردن، یک پاراگراف را متمایز کنید.lead.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.

سبک های متن درون خطی

یک ظاهر طراحی برای عناصر رایج HTML5 درون خطی.

می توانید از تگ علامت گذاری استفاده کنیدhighlight text.

This line of text is meant to be treated as deleted text.

This line of text is meant to be treated as no longer accurate.

This line of text is meant to be treated as an addition to the document.

This line of text will render as underlined.

این خط از متن به عنوان چاپ ظریف در نظر گرفته شده است.

این خط به صورت متن پررنگ ارائه می شود.

This line rendered as italicized text.

اگر می خواهید به متن خود استایل بدهید، باید از کلاس های زیر استفاده کنید:

  • .mark will apply the same styles as <mark>.
  • .small will apply the same styles as <small>.
  • .text-decoration-underline will apply the same styles as <u>.
  • .text-decoration-line-through will apply the same styles as <s>.

تراز فهرست توضیحات

با استفاده از کلاس های از پیش تعریف شده سیستم گرید ما (یا میکس های معنایی)، اصطلاحات و توضیحات را به صورت افقی تراز کنید. .text-truncate class to truncate the text with an ellipsis.

لیست های توضیحات
لیست توضیحات برای تعریف اصطلاحات عالی است.
مدت، اصطلاح

تعریف اصطلاح.

و چند متن دیگر برای تعریف مکان‌نما.

یک اصطلاح دیگر
این تعریف کوتاه است، بنابراین هیچ پاراگراف اضافی یا هیچ چیز دیگری وجود ندارد.
اصطلاح کوتاه شده کوتاه شده است
این می تواند زمانی مفید باشد که فضا کم باشد.
لانه سازی
لیست تعریف تو در تو
من شنیدم که شما لیست های تعریف را دوست دارید.

خلاصه

به طور پیش فرضcursor on summary is text, so we reset that to pointer to convey that the element can be interacted with by clicking on it.

Some details

اطلاعات بیشتر در مورد جزئیات

Even more details

در اینجا جزئیات بیشتری در مورد جزئیات وجود دارد.

© Clivax.
ساخته شده باتوسطCodebucks