Let's build an anchor tag just like this one: Google that will open a hyperlink to the Google search engine in a separate tab of our web browser. Try this link. It works!
Step 1. We need opening and closing anchor tags: <a></a>
Step 2. We need to add an attribute that provides a hypertext reference: <a href=""></a>
Step 3. We need to add a target destination to that hypertext reference: <a href="https://google.com"></a>
In most cases, the target destination will be a URL (uniform resource locator) to another web page somewhere in cyberspace. But right now, there is nothing to click on to take you to that target destination. Let's add that next.
Step 4. We need to add some appropiate and clickable text between the opening and closing anchor tags. Maybe that text should be Google: <a href="https://google.com">Google</a>
At this point, your hyperlink actually works! But there is something else required to force the target destination to open in a new tab on your web browser. Otherwise, it will replace our own web page that resides in the current tab with the one that resides at the target destination. And we don't want visitors to our website to lose their connection to our website. So, let's add that right now.
Step 5. We need to add one more attribute to our opening tag that will force the target destination to open in a blank page, which is a new tab in our web browser: <a href="https://google.com" target="_blank">Google</a>
Step 6. Replace this text with your own anchor tag code, and test it to make sure that it really works!
Step 7. Look at the CSS code in the style.css file to see how we styled the CSS for our a { } CSS rules, and the CSS for our a:hover { } CSS rules, on lines 52 through 60. Notice that the color of the hyperlink changes from blue to crimson when you hover your mouse over it. Also, notice that we have one rule text-decoration: none; that removes the underline from the hyperlink, which is the default CSS for all anchor tags. Most web developers hate that underline, so they change it.