Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML HTML Basics Images, Text and Links Images and File Paths Challenge

Posted by Nick Evershed
Nick Evershed
6,429 Points

Caption tag?

What is a caption tag, and how would I add one?

<!DOCTYPE html> <html> <head> <title>The Moon</title> </head> <body> <img src="img/moon.jpg" alt="Moon"> </img> </body> </html>

index.html 
<!DOCTYPE html> 
<html>
  <head>
    <title>The Moon</title>
  </head>
  <body>
    <img src="img/moon.jpg" alt="Moon"> </img>
  </body>
</html>
Adam N
Adam N
70,280 Points

The video before the challenge goes over how to add a caption. Let me know if this helps here

2 Answers

Jonathan Gardner
Jonathan Gardner
8,383 Points
Jonathan Gardner
Jonathan Gardner
8,383 Points

You need to nest the img inside of <figure> tags and add the <figcaption> Tag to specify the caption text. Also img is a self closing tag so you don’t need a </img> closing tag after it.

<figure> <img src=“img/moon.jpg” alt=“Moon”> <figcaption>This is your caption</figcaption> </figure>

leosa
leosa
Courses Plus Student 4,622 Points
leosa
leosa
Courses Plus Student 4,622 Points

I agree with Jonathan. At the beginning, I thought you had meant the <caption> tag not the <figcaption>, but this makes since. By the way, the <figcaption> tag defines a caption for a <figure> element. The <figcaption> element can be placed as the first or last child of the <figure> element.

If that definition doesn't make any sense, here is an example:

 <figure>
  <img src="pic_trulli.jpg" alt="Trulli" style="width:100%">
  <figcaption>Fig.1 - Trulli, Puglia, Italy.</figcaption>
</figure>
leosa
PLUS
leosa
Courses Plus Student 4,622 Points
leosa
leosa
Courses Plus Student 4,622 Points

The <caption> tag defines a table caption. The <caption> tag must be inserted immediately after the <table> tag. By the way, you can specify only one caption per table.

Here is an example of using the <caption> tag:

 <table>
  <caption>Monthly savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
Adam N
Adam N
70,280 Points

He's dealing with images here so he wont necessarily be using the caption element. Look at the course + stage he's on for context to his problem.