How to bookmark a website page - anchors in HTML
Sometimes you need to make sure that the visitor not only goes to the page, but also gets to a certain place. This is done using HTML anchors .
Anchor (anchor) is the name of the technology bookmarks on a site page , that is, a tag to which a visitor returns from any other place. It is very easy to make a bookmark on a website page. You can bookmark not only the current page, but also others. HTML anchors can be very useful in various cases, for example, for creating navigation on large pages with sub-paragraphs, for creating simple bookmarks, etc.
Small example:
& lt; h2> Anchor references & lt; / h2>
& lt; p> & lt; a href = "# anchor1"> Go to anchor 1 & lt; / a> & lt; / p>
& lt; p> & lt; a href = "# anchor2"> Go to anchor 2 & lt; / a> & lt; / p>
& lt; p> & lt; a href = "# anchor3"> Go to anchor 3 & lt; / a> & lt; / p>
& lt; h2> Anchors on page & lt; / h2>
& lt; p id = "anchor1"> Anchor on page 1 & lt; / p>
& lt; p id = "anchor2"> Anchor on page 2 & lt; / p>
& lt; p id = "anchor3"> Anchor on page 3 & lt; / p>
As you can see, it is enough to add the id attribute to the required tag and refer to it in the link after the # sign. Previously, the name attribute was used instead of id , but this has changed in HTML5. If the page contains a anchor link , but there is no anchor, no error will occur. This property of anchors is often used in JavaScript to handle clicking on links.
It is important to note that after clicking on the anchor within the current page, the navigation in the browser changes - the back and forward buttons take into account the clicks made. Therefore, you will have to press the back button several times until you go to the previous page. And in order to make a smooth transition to the anchor , you need to use JavaScript .
Latest articles
- 09.07.22IT / Misc Convert office files DOC, DOCX, DOCM, RTF to DOCX, DOCM, DOC, RTF, PDF, HTML, XML, TXT formats without loss and markup changes
- 07.07.22IT / Safety How to protect PHP, JS, HTML, CSS source code - obfuscation, minification, compression and encryption
- 06.07.22IT / Safety Connection not secure, problem with Lets Encrypt - how to fix expired 09/30/2021 DST Root CA X3, remove it manually and install ISRG Root X1. Example on MS Windows 7
- 08.07.21IT / Misc How to make a free translation for a website without an API, translate documents in Google Translate
- 06.07.21IT / Misc How to make a subscription button on a website, a subscriber base and automatic mailing