Adding Links and Images
Hyperlinks
Hyperlinks are created with the <a> (anchor) tag. They can link to external websites or to internal pages within your own site.
<a href="https://www.google.com">Visit Google</a>
<a href="basics.html">Go to HTML Basics</a>
<a href="basics.html">Go to HTML Basics</a>
🔗 Example Output:
Images
The <img> tag is used to display images. It requires the src (image path) and alt (alternative text) attributes.
<img src="https://imgs.search.brave.com/219eMoi8TI75g-fi0buN_LnlJ9diSwmg2Obp6jU-g2Q/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/aG9zdGluZ2VyLmNv/bS90dXRvcmlhbHMv/d3AtY29udGVudC91/cGxvYWRzL3NpdGVz/LzIvMjAxOC8xMS93/aGF0LWlzLWh0bWwt/My5qcGc" width="500px" alt="Placeholder Image">
🖼 Example Output:
Links with Images
You can even turn an image into a clickable link by wrapping it inside an <a> tag.
<a href="https://openai.com" target="_blank">
<img src="https://imgs.search.brave.com/it0fhVrdrLlfTWdRQK2FCDHpN0XbFXpruvX0liZS3jU/rs:fit:500:0:1:0/g:ce/aHR0cHM6Ly9pbWFn/ZS5jbmJjZm0uY29t/L2FwaS92MS9pbWFn/ZS8xMDgwNjY1OTQt/MTczMjIyNTE3NTQ4/MC1nZXR0eWltYWdl/cy0yMTg1Mjc1MTQ2/LWF2aWxzLW5vdGl0/bGUyNDExMjFfbnBM/aEQuanBlZz92PTE3/NTU4MjU5MTAmdz02/MDAmaD0zMDAmdnRj/cm9wPXk" alt="Clickable Image">
</a>
<img src="https://imgs.search.brave.com/it0fhVrdrLlfTWdRQK2FCDHpN0XbFXpruvX0liZS3jU/rs:fit:500:0:1:0/g:ce/aHR0cHM6Ly9pbWFn/ZS5jbmJjZm0uY29t/L2FwaS92MS9pbWFn/ZS8xMDgwNjY1OTQt/MTczMjIyNTE3NTQ4/MC1nZXR0eWltYWdl/cy0yMTg1Mjc1MTQ2/LWF2aWxzLW5vdGl0/bGUyNDExMjFfbnBM/aEQuanBlZz92PTE3/NTU4MjU5MTAmdz02/MDAmaD0zMDAmdnRj/cm9wPXk" alt="Clickable Image">
</a>
🔗🖼 Example Output: