CSS Reference
Style responsive and accessible interfaces using reusable CSS rules, layout systems and clear visual states.
Connecting a CSS Stylesheet
CSS controls presentation while HTML provides structure. Connect the file Create css/style.css, ...
CSS Selectors, Classes and Reusable Rules
Selectors identify the HTML elements a rule styles. body { margin: 0; } h1 { color: #123f73; } .c...
CSS Box Model and Spacing
Every element is a box made from content, padding, border and margin. *, *::before, *::after { ...
Responsive Layouts with Flexbox and Grid
Responsive layouts adapt to available space rather than one device size. Flexbox navigation .navi...
Accessible Colour, Typography and Focus
Accessible styling supports perception, reading and keyboard use. body { color: #1f2933; back...
Styling Forms and Validation Messages
Form styling should make labels, controls, instructions and errors easy to identify. .form-group ...
Styling Tables, Navigation and Data Displays
Data interfaces should prioritise interpretation over decoration. .table-wrap { overflow-x: auto;...