HTML Home
HTML Introduction
HTML Editors
HTML TAGS
HTML Paragraph
HTML Heading
HTML with CSS
HTML Text Formatting
HTML Quotation
HTML Comment
HTML Links
HTML Images
HTML Audio
HTML Video
HTML Tables
HTML Lists
HTML Class
HTML Iframes
HTML File Path
HTML Scripts
HTML Head Section
HTML Structure
HTML Symbols
HTML Character Set
HTML Entity
HTML Color Codes
HTML Forms
HTML Forms
HTML Form Elements
HTML5 Form Element
HTML Form Attributes
HTML Others
What is HTML links or Hyperlinks? When you want to linking to another file, page, website, email or image it's call to be HTML links or Hyperlinks. HTML links is call to HTML Hyperlinks.
How to use HTML hyperlinks?
HTML hyperlinks use by anchor tag (<a>) and it close (</a>)
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="Your link here">Your Display Text or Image</a> <p>Example</p> <a href="../index.php">Go to Home</a> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="../index.php" target="_blank">Go to Home</a> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="../index.php" title="Go to Home">Go to Home</a> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="Your link here">Your Display Text</a> <p>Example</p> <a href="foldername">Go to Folder</a> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="Your file name with right extension">Your File name or any Text</a> <p>Example</p> <a href="file.txt">Open File</a> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="http://Your link here">Your Display Text or Image</a> <p>Example</p> <a href="http://www.google.com">Go to Google</a> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="mailto:Your link email here">Your Display Text or Image or Email</a> <p>Example</p> <a href="mailto:[email protected]">Mail to SAF</a> </body> </html>
When you create a hyperlink in same HTML file then its called one page Hyperlink. When developer want to link on same HTML page then use this Hyperlink <a href="#link">Display Text</a> and finally write where to go when click on this link <p id="link">Sample Text</p>
<!DOCTYPE html> <html lang="en"> <head> <title>HTML Hyperlink Tutorials</title> </head> <body> <a href="#Your Link">Your Display Text or Image</a> <p>Example</p> <a href="#link">Go to Bottom</a> <!-- Example 1 for One/Same page link --> <a href="http:///www.yourdomain.com/index.php#link">Go to Website Bottom</a> <!-- Example 2 for One/Same page link --> <p> And finally define your link where to go when clink on this link </p> <p id="link">Here scroll your browser when click on this link. </p> </body> </html>
HTML Hperlink for one/same page link
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Hyperlink Tutorials</title>
<style type="text/css">
a{color:red;text-decoration:none;}
a:hover{color:green;text-decoration:underline;}
a:visited{color:red;text-decoration:none;}
a:active{color:red;text-decoration:none;}
</style>
</head>
<body>
<a href="Your Link">Your Display Text</a>
<p>Example</p>
<a href="../index.php">Your Display Text</a>
</body>
</html>