Skip to main content

Command Palette

Search for a command to run...

Html Tutorial For Beginners Part 3

In this post you'll learn how connect your page to External or Internal content or pages via anchor element

Updated
1 min read
Html Tutorial For Beginners Part 3
A

I am a web developer from Afghanistan and I am ready for remote working and mentoring and as well for accepting internship.

You can use a(anchor) elements to link to content outside of your web page. aelements need a destination web address called an hrefattribute. They also need anchor text. Here's an example:

<a href="https://www.freecodecamp.org">this links to freecodecamp.org</a>

Then your browser will display the text this links to freecodecamp.org as a link you can click and that link will take you to the web address https://www.freecodecamp.org

Task

Create an a element that links https://www.freecatphotoapp.com and has cat photos as its anchor text.

Solution

<a href="https://www.freecatphotoapp.com">cat photos</a>

Note we can also send email and call someone via anchor element.

Examples

<!--sending email via anchor element-->
<a href="mailto:ahmad@gmail.com">Email us</a>
<!--call someone via anchor element-->
<a href="tel:009078654325">contact us</a>

Tips

Anchor element has some attributes that I wanna mention them here:

  • target
  • download

target attribute takes two or three parameters I am not sure 💯

Examples

<!-- _blank parameter opens a new tab in browser window-->
<a href="https://www.unsplash.com" target="_blank">Go to unsplash</a>
<!-- doesn't open a new tab -->
<a href="https://www.unsplash.com" target="parent">Go to unsplash</a>

If you want to download a file include download attribute like target. Please like and share

HTML TUTORIAL FOR BEGINNERS

Part 3 of 11

In this series, I will teach or post useful lessons about HTML and it's tips and tricks

Up next

HTML Tutorial For Beginners Part 4

In this article you learn how to link your section internally