Tipografi

Genel ayarlar, başlıklar, gövde metni, listeler ve daha fazlası dahil olmak üzere v5 tipografisi için bilgi ve örnekleri bu dökümanda bulabilirsiniz.

v5, sıfırlama sonrası temel genel görüntüleme, tipografi ve bağlantı stillerini ayarlar.

Başlıklar#

Seviye Başlığı (h1-h6)#

<h1> ile <h6> arasındaki tüm HTML başlıkları

(h1) 1. Seviye v5 başlığı

(h2) 2. Seviye v5 başlığı

(h3) 3. Seviye v5 başlığı

(h4) 4. Seviye v5 başlığı

(h5) 5. Seviye v5 başlığı

(h6) 6. Seviye v5 başlığı

Bir başlığın yazı boyutunu değiştirmek istiyorsunuz ama <h1> ... <h6> etiketlerini kullanamadığınız durumlarda .h1 ile .h6 class'larını kullanabilirsiniz.h[değer]

h1. v5 Başlık

h2. v5 Başlık

h3. v5 Başlık

h4. v5 Başlık

h5. v5 Başlık

h6. v5 Başlık

Örnek Kullanım

<p class="h1">h1. v5 Başlık</p>

Duyarlı Yazı Boyutu#

.fs-[değer] ile ekran çözünürlüğüne duyarlı başlıklar oluşturabilirsiniz.

1. Seviye

2. Seviye

3. Seviye

4. Seviye

5. Seviye

6. Seviye

Örnek Kullanım

<p class="fs-2">2. Seviye</p>

Büyük ekran başlığı#

Standart başlık öğeleri, sayfa içeriğiniz en iyi sonucu verecek şekilde tasarlanmıştır. Öne çıkarılacak daha büyük bir başlığa ihtiyacınız olduğunda, display-1 ... display-6 değelerini kullanabilirsiniz.

Gösterim 1

Gösterim 2

Gösterim 3

Gösterim 4

Gösterim 5

Gösterim 6

<p class="display-3">Gösterim 3</p>

Alıntılar#

Başka bir kaynaktan içerik bloklarını alıntılamak için <blockquote>...</blockquote> kullanabilirsiniz.

v5 Belgeleri - T-Soft E-Commerce tarafından hazırlanmıştır.

<blockquote class="blockquote">
  <p>v5 Belgeleri - T-Soft E-Commerce tarafından hazırlanmıştır.</p>
</blockquote>

Metin İşlemleri#

Nitelik	Class
Altı çizili metin	`text-underline`
Üstü çizili metin	`text-delete`
Eğik metin	`fs-italic`
Tüm harfler küçük	`text-lowercase`
Tüm harfler büyük	`text-uppercase`
İlk harfler büyük	`text-capitalize`
Metin aynı satırda devam eder [bilgi]	`text-nowrap`
Uzun metini aşağı atar	`text-wrap`
Uzun kelimeyi aşağı atar	`text-break`
Yazı boyutu küçük (10px)	`text-small`
Yazı boyutu küçük (smaller)	`fs-smaller`
Yazı boyutu normal (normal)	`fs-normal`
Yazı boyutu daha büyük (larger)	`fs-larger`
Yazı kalınlığı ince (lighter)	`fw-lighter`
Yazı kalınlığı ince (fw 300)	`fw-light`
Yazı normal (fw 400)	`fw-regular`
Yazı orta (fw 500)	`fw-medium`
Yazı yarı kalın (fw 600)	`fw-semibold`
Yazı kalın (fw 700)	`fw-bold`
Yazı ekstra kalın (fw 800)	`fw-extrabold`
Yazı en kalın (fw 900)	`fw-black`

Listeleme#

Liste maddesi
1. Seviye
- 2. Seviye
- Liste maddesi
Liste maddesi

<ul>
  <li>Liste maddesi</li>
  <li>1. Seviye
    <ul>
      <li>2. Seviye</li>
      <li>Liste maddesi</li>
    </ul>
  </li>
  <li>Liste maddesi</li>
</ul>

Sıralı bir liste örneği#

TEKROM
T-SOFT
v5
v4
...

<ol>
<li>TEKROM</li>
<li>T-SOFT</li>
<li>v5</li>
<li>v4</li>
<li>...</li>
</ol>

Satır içi metin öğeleri (Tarayıcı varsayılan)#

Vurgulama	`<mark></mark>` Bir metinde belirtilen alanın vurgulanmasına yarar.
~~Üstü çizili metin~~	`<del></del>` etiketi, bir belgeden silinen metni tanımlar.
~~Üstü çizili metin~~	`<s></s>` Bir metin satırının üstünü s ile çizmek artık o bilginin doğru olmadığını belirtir.
Belge yeni bilgi	`<ins></ins>` Belgeye yeni eklenen bilgiyi belli etmek için kullanılır.
Altı çizili metin	`<u></u>` Bir metin satırının altını çizmek için kullanabilirsiniz.
Küçük metin	`<small></small>` Etiketi daha küçük metni tanımlar.
Kalın metin	`<strong></strong>` İçindeki içerik kalın olarak görüntülenir.
İtalik metin	`<em></em>` İçindeki içerik kalın olarak görüntülenir.

kaynak: https://www.w3schools.com/tags/