Python for All

Part One

Font Properties

Typography is not decoration — it is the primary vehicle through which your readers experience your writing. The properties that control it are few, but their effect is enormous.

font-family sets the typeface. You list multiple fonts separated by commas — the browser will use the first one it can find. The last item should always be a generic family like serif, sans-serif, or monospace as a fallback.

font-size sets the size. Use px for fixed sizes, or em/rem for sizes relative to the base font. For body text, 17–19px is a comfortable reading size.

font-weight sets the boldness: 400 is regular, 700 is bold. Some fonts have intermediate weights like 600.

font-style sets italic: italic or normal.

Part Two

Line Height and Letter Spacing

line-height is the vertical space between lines of text. For body text, a line height of 1.6 to 1.8 is standard — it creates breathing room between lines and dramatically improves readability. Values without a unit (like 1.75) are relative to the font size.

letter-spacing is the horizontal space between individual characters. Body text rarely needs it. But uppercase labels and kickers often benefit from a small positive value (e.g. 0.12em) to improve legibility at small sizes.

text-transform changes capitalisation without touching the HTML: uppercase, lowercase, or capitalize (first letter of each word).

Part Three

The Box Model — Margin and Padding

Every HTML element is a rectangular box. CSS controls the space around and inside it with two properties:

• padding — space inside the element, between the content and the border. Increasing padding makes the element feel roomier.
• margin — space outside the element, pushing neighbouring elements away. Use it to control the vertical rhythm between paragraphs, headings, and sections.

Both can be set uniformly (margin: 20px), or individually per side: margin-top, margin-right, margin-bottom, margin-left. A shorthand with four values sets them in that order: margin: top right bottom left.

Part Four

max-width and Centering — The Reading Column

Long lines of text are hard to read. Eye-tracking studies suggest that a comfortable line length is 60–75 characters. This translates to roughly 600–700px for a 17–18px font.

Use max-width to cap the width of your article body. Then center it horizontally with margin: 0 auto — this automatically distributes the remaining space equally on both sides.