Dylanc
January 9, 2023, 4:46pm
1
I need help with this
So I need to turn the imag below into a link using the anchor “href” value. The link shall be the freecatphotoapp one.
<html>
<body>
<main>
<h1>CatPhotoApp</h1>
<h2>Cat Photos</h2>
<!-- TODO: Add link to cat photos -->
<p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back." >
What have you tried so far? I see a link, but it is a text link, not an image.
Dylanc
January 9, 2023, 5:28pm
3
Hi sorry here is the image which I should convert to a link and anchor with a href attribute: "https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg
the anchor to this image-link should be https://freecatphotoapp.com
Right, so what code have you written to try to turn that image into a link?
Dylanc
January 9, 2023, 5:34pm
5
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
This ^ is the code that was given to me. And I have to build in the anchor to the link https://freecatphotoapp.com
Ok, so what does your code look like if you try to build the link?
Dylanc
January 9, 2023, 5:35pm
7
Im thinking of putting <a at the beginning and using target onto the whole link.
ok, what does that look like?
Dylanc
January 9, 2023, 5:37pm
9
Like this
<a target= >img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."> href="https://freecatphotoapp.com"/a>
You should not in any way modify or otherwise change the img
element. Your img
is now broken.
Also, your opening and closing anchor tags are not complete. Every single tags needs both a < and a >
I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>
) to add backticks around text.
See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').
system
Closed
July 11, 2023, 5:40am
12
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.