html · level 1 · unit 2 · lesson 4
- meet it
- guess first
- your turn
- fix it
- nailed it
Tap a green word if you get lost.
meet it
An adds an extra detail to a tag.
An attribute is an extra detail you write inside an opening tag. It has a name, an equals sign, then a in quote marks, like title="A note".
The title attribute gives an element a little note. Rest your mouse on the element and the note pops up beside it.
Attributes only ever go in the opening tag, after the tag's name and a space. The closing tag stays plain. Always put the value between two quote marks.
<p title="He is a very good boy">This is Biscuit.</p> Press show my page to see it here.
Phones have no mouse to rest, so never hide anything important in a title.
guess first
Where will the attribute's words appear?
Guess before you run it. Wrong guesses are how you learn, and nothing is marked.
<p title="Made with love">Grandma's apple pie</p>
your turn
Your turn. Hide the answer to a riddle.
Write a riddle in the paragraph, then hide its answer in the title attribute. Run it and rest your mouse on the riddle to check.
Press show my page to see it here.
- the answer hides in the titlenot checked yet
- the riddle shows on the pagenot checked yet
fix it
The paragraph has vanished. Can you fix it?
Press show my page to see it here.
- the paragraph about Mittens showsnot checked yet
- the note says our fluffiest guestnot checked yet
- The heading shows, but the paragraph has gone. Look at its opening tag.
- Count the quote marks around the value. There should be two, one at each end.
- Add a quote mark after guest, before the
>, then press run.
nailed it
your tags carry extra details now. :D
- Attributes go inside the opening tag.
- Write them as a name, an equals sign and a value in quotes.
- Forget a quote mark and things can vanish.
new words in your collection
- attribute
- value
This lesson isn’t saved. A free account remembers every lesson you finish.