CSS selectors (id v class)

Code pattern

Jump to a topic

See every item in the sequence

Definition

A class selector (.name) styles many elements; an id selector (#name) styles one unique element.

Example

.button { color: white } styles every element with class button.

Found in: syllabus, course specifications, 2025 HSC marking guidelines, sample exam and familiarisation guidelines, school notes, past SDD papers.

Where you'll use it in the test

Syllabus area: Y12 Programming for the Web.

Question types it can appear in

Code reading: 2025 Q7 and sample Q16a: read a CSS fragment
Multiple choice: Pick the option that matches the definition or example.

Where it has appeared in the paper

Programming for the Web (Part A, B). Part letters follow each paper’s own layout.

How to use it

A model sentence

General advice, built from the definition and example above

Code pattern: “A class selector (.name) styles many elements; an id selector (#name) styles one unique element.” Then apply it: .button { color: white } styles every element with class button.

In a short answer, give the definition in your own words first, then tie it to the situation in the question. Do not copy the example above unless it fits the scenario.

Command words used with it

From the linked past questions

Identify: Recognise and name. (2025 HSC Q7 (1 mark): CSS code fragment, Sample exam Q16a (1 mark): CSS (id v class))

Official worked answer

Sample exam Q16a (1 mark): CSS (id v class) (1 mark): official criteria and sample answer

Criteria

1: Identifies the correct answer.

Sample answer

The id qe_item has not been correctly referenced. (The HTML uses id="qe_item" but the CSS selector is .qe_item, which targets a CLASS. An id selector is #qe_item.)

Open the question page

Go deeper

Flashcard: CSS selectors (id v class) in Programming for the Web (Year 12) · study that set
Memorise: Web development system: front end, back end, databases
Full term page: every question, note and marking comment for CSS selectors (id v class)

Check yourself

Write or say the “CSS selectors (id v class)” pattern from memory: the syntax and what it does.

Reveal the answer