Revision:
download ; value: filename ;
specifies that the target will be downloaded when a user clicks on the hyperlink.
href ; value: url;
specifies the URL of the page the link goes to.
hreflang ; value: language code;
specifies the language of the linked document.
media ; value: media_query;
specifies what media/device the linked document is optimized for.
ping ; value: list_of_URLs;
specifies a space-separated list of URLs to which, when the link is followed, post requests with the body ping will be sent by the browser (in the background). Typically used for tracking.
referrerpolicy ; value: no-referrer, no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin-when-cross-origin, unsafe-url;
specifies which referrer information to send with the link.
rel ; value: alternate, author, bookmark, external, help, license, next, nofollow, noreferrer, noopener, prev, search, tag;
specifies the relationship between the current document and the linked document.
target ; value: _blank, _parent, _self, _top;
specifies where to open the linked document.
type ; value: media_type;
specifies the media type of the linked document.
The most important attribute of the <a> element is the "href" attribute, which indicates the link's destination. By default, links will appear as follows in all browsers: an unvisited link is underlined and blue, a visited link is underlined and purple, an active link is underlined and red. If the <a> tag has no "href" attribute, it is only a placeholder for a hyperlink.
A linked page is normally displayed in the current browser window, unless you specify another target. Use CSS to style links.
<a href=" " media=" " type=" " > . . . </a>
example
An image as a link:
code:
<p class="spec">An image as a link: <a href="https://www.lwitters.com">
<img border="0" alt="my website" src="../../pics/cartoon.jpg" width="100" height="100">
</a></p>
example
If you set the target attribute to "_blank", the link will open in a new browser window or a new tab.
code:
<a class="spec" href="https://www.lwitters.com" target="_blank" rel="noopener">Visit my website!</a>
<p class="spec">If you set the target attribute to "_blank", the link will open in a new
browser window or a new tab.</p>
example
To create a link that opens in the user's email program (to let them send a new email), use mailto: inside the href attribute.
code:
<p class="spec">To create a link that opens in the user's email program (to let them send a new email), use mailto:
inside the href attribute.</p>
<p class="spec"><a href="mailto:[email protected]">Send email</a></p>
example
code:
<a class="spec" href="#top">Go to top of the page</a>
example
code:
<a class="spec" href="javascript:alert('Hi there, how are you!');">execute JavaScript</a>
The anchor element is used to create hyperlinks between a source anchor and a destination anchor.
The source is the text, image, or button that links to another resource and the destination is the resource that the source anchor links to.
Add an anchor to the spot that you want to jump to: locate the spot that you want to have users jump to, and add the following line of code to that spot: <;a name="anchor"><;/a>.
You can change the name "anchor" to anything that makes sense for you.
Add an HTML anchor link: somewhere on your page make a link like normal.
When you declare the link location use the name you gave your anchor here above, but add a “#” in front of the name.
For example: <a href="#anchor">text</a>.
The "#anchor" is the link to your anchor, and "text" is the text that the link will display on the webpage.
example
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
Go to the top.
Code:
<h1 name="top">HTML coding examples - 21-01</h1>
<p class="example">Go to the <a href="#top"><top></a>.</p>
example
Code:
<h1 name="top">HTML coding examples - 21-01</h1>
<p class="example"><a href="#top">link to top</a></p>
example
Click the button to go to the top.
Code:
<p class="example">Click the button to go to the top.</p>
<p class="example"><button><a href="#top">To the top</a></button></p>
To do this just add the anchor name to the end of the "href" link path. For example: <a href="your-page-title.html#anchor">text</a>
example
Click on this-link to go to my website.
Code:
<p class="example">Click on <a href="https://www.lwitters.com/" target="_blank"> this-link </a>to go to my website.</p>