font — CSS Technical Interview Questions & Answers

font-family, font-size, font-weight and font-style.

font

  • font-family, font-size, font-weight and font-style.
  • font is a CSS property: it changes how a selected element looks or sits. You write it inside a rule: .card { font: …; }
  • Change one value, refresh, say what moved: colour, space, size, or stacking. That is how you learn properties — not by memorising the spec.
  • Trap: putting it on the wrong selector (parent vs child). Trap: px only on a phone page — learn rem/%/flex too when it is layout.
  • Box model reminder: width/height, padding, border, margin are different. If font is about space, draw the box.

Technical Interview Tip: font: one rule on .card, then say what changed.

Code Examples for font

font — working example

.body-text {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 400;
  font-style: normal;
  line-height: 1.6;
}

.heading {
  font-family: system-ui, sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
}

font-* properties control typeface, size, weight, and style; shorthand font can set several at once.

How to Explain font to an Interviewer

What does font do?

A CSS property that changes look/layout Write it in a rule and refresh