Siksha Sarovar

Siksha Sarovar (sikshasarovar.com) is a free educational web application that helps students in India learn programming and prepare for academic and competitive exams. The platform offers structured coding courses (C, C++, Python, Java, HTML, CSS, PHP, Power BI, AI, Machine Learning, Data Science), complete university curriculum notes for BCA/MCA students with previous year question papers, Class 10 and Class 12 CBSE/HBSE school notes, and dedicated preparation material for SSC, UPSC, Banking, Railway and other government exams. Browsing the site is completely free and requires no account. Users may optionally sign in with Google solely to save their learning progress, quiz scores and personal preferences across devices.

Privacy Policy | Terms of Service | Contact Siksha Sarovar | About Siksha Sarovar

v4.0.9 · PWA
Siksha Sarovar logo
Siksha Sarovar
Your Learning Universe

Siksha Sarovar is a free e-learning platform for coding courses, BCA university notes and competitive exam preparation. Optional Google sign-in saves your learning progress across devices.

Initializing knowledge base…
Compiling modules 0%

7. CSS - Fonts

Lesson 7 of 34 in the free CSS Customization: Zero to Hero notes on Siksha Sarovar, written by Rohit Jangra.

CSS Fonts

The CSS font properties define the font family, boldness, size, and style of a text.

1. font-family

The font family of a text is set with the font-family property.

  • Start with the name of the font you want to use.
  • Always end with a generic family name to let the browser pick a similar font in the generic family, if no other font is available.
p {
  font-family: "Times New Roman", Times, serif;
}

2. font-style

Mostly used to specify italic text.

  • normal: The text is shown normally (default).
  • italic: The text is shown in italics.
  • oblique: The text is "leaning" (oblique is very similar to italic, but less supported).

3. font-size

Sets the size of the text.

  • Absolute size: Sets the text to a specified size (px, pt).
  • Relative size: Sets the size relative to surrounding elements (em, %).

4. font-weight

Specifies the weight of a font.

  • Values: normal, bold, bolder, lighter, or 100-900.

5. font-variant

Specifies whether or not a text should be displayed in a small-caps font.

p.small {
  font-variant: small-caps;
}