QuitExams

W3.CSS Font Size Classes

W3.CSS provides several font size classes to change the text size easily.

1️⃣ w3-tiny

Tiny font size

<div class="w3-tiny w3-padding w3-blue">
  This is tiny text
</div>

2️⃣ w3-small

Small font size

<div class="w3-small w3-padding w3-green">
  This is small text
</div>

3️⃣ w3-medium

Medium font size

<div class="w3-medium w3-padding w3-red">
  This is medium text
</div>

4️⃣ w3-large

Large font size

<div class="w3-large w3-padding w3-orange">
  This is large text
</div>

5️⃣ w3-xlarge

Extra large font size

<div class="w3-xlarge w3-padding w3-purple">
  This is xlarge text
</div>

6️⃣ w3-xxlarge

Extra Extra Large font size

<div class="w3-xxlarge w3-padding w3-teal">
  This is xxlarge text
</div>

7️⃣ w3-xxxlarge

Extra Extra Extra Large font size

<div class="w3-xxxlarge w3-padding w3-indigo">
  This is xxxlarge text
</div>

7️⃣ w3-jumbo

Extra Extra Extra Large font size

<div class="w3-jumbo w3-padding w3-indigo">
  This is jumbo text
</div>

W3.CSS Font Family Classes

W3.CSS provides font family classes for different styles.

1️⃣ w3-serif

Serif font family

<div class="w3-serif w3-padding w3-blue">
  This text is serif
</div>

2️⃣ w3-sans-serif

Sans-serif font family

<div class="w3-sans-serif w3-padding w3-green">
  This text is sans-serif
</div>

3️⃣ w3-monospace

Monospace font family

<div class="w3-monospace w3-padding w3-red">
  This text is monospace
</div>