Learn HTML by Building a Cat Photo App - Step 12

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->

<!-- User Editable Region -->

      <p>See more cat photos in our gallery.</p>
      <a href="https://freecatphotoapp.com"><a/>

<!-- User Editable Region -->

      <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
    </main>
  </body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.0.0 Safari/537.36

Challenge: Learn HTML by Building a Cat Photo App - Step 12

Link to the challenge:

2

You’ll want to reset the step to get the original HTML back.

Once you do that, don’t change anything that is already there, for example, the link below the p element.

The only thing you want to do is turn the existing words “cat photos” in the p element into a link by wrapping them in an anchor element. You do this by surrounding them with a tags. Just like you did to the words “Link to cat pictures” to turn them into a link. You put an opening a tag before the words and a closing a tag after the words.

So just add those two a tags to turn “cat photos” into a link. That’s all you need to do here. And of course add the href attribute too.

3

Welcome to the community!

Here is a great article, explaining and providing examples, on how to turn text and images into links. It is from the FCC News category and authored by one of the leaders.

FCC News Article Turn Image and Text Into Links

Happy coding!

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.