| 1) Open a link in the same browser window |
| HTML uses the <a> (anchor) tag to create a link to another document. |
| An anchor can point to any resource on the Web: an HTML page, an image, a sound file, a movie, etc. |
| Different attributes of the <a> tag are href, name, target. So lets see some practical on <a> tag and its attributes. |
| If you want to open the new hyperlinked page in the same window then do not write the “target”attribute in the <a> tag. |
| The syntax of creating an anchor: |
| <a href=”url”>Text to be displayed</a> OR <a href=”url” >Text to be displayed</a> |
| Example: |
| <a href=”http://csitquestions.com”> Visit www.csitquestion.com </a> <a href=”c:\abc.html” > Visit abc.html </a> |
| Note: |
| You can write the path in both ways in HTML |
| <a href=”c:\abc\abc.html” > Visit www.csitquestion.com </a> or <a href=”c:/abc/abc.html” > Visit abc.html </a> |
| The <a> tag is used to create an anchor to link from, in href attribute we provide the address or path of the web page (any file) to which we want to link (jump, open) and the words between the open and close of the anchor tag will be displayed as a hyperlink text. |
| Remember the file you want to open on an hyperlink should exist on the location you provided in the href attribute of the <a> tag. |
| The above Example will display the text in a browser: |
| Visit www.csitquestion.com |
| And now click on above text you will get linked to website of ebizel.com. And the Website of ebizel.com gets opened in the same window. In this way a hyperlinking to jump to another page is done. |
| 2) Open a link in a new browser window |
| HTML uses the <a> (anchor) tag to create a link to another document. An anchor can point to any resource on the Web: an HTML page, an image, a sound file, a movie etc. |
| Different attributes of the <a> tag are href, name, target. so lets see some practical on <a> tag and its attributes. |
| The syntax of creating an anchor: |
| <a href=”url”> Text to be displayed </a> OR <a href=”url” target=”_blank “> Text to be displayed </a> |
| Example: |
| <a href=”http://csitquestions.com”> Visit www.csitquestion.com </a> <a href=”c:\abc.html” target=”_blank “> Visit abc.html </a> |
| Note: |
| You can write the path in both ways in HTML |
| <a href=”c:\abc\abc.html” target=”_blank “> Visit www.csitquestion.com </a> or <a href=”c:/abc/abc.html” target=”_blank “> Visit abc.html </a> |
| The <a> tag is used to create an anchor to link from, in href attribute we provide the address or path of the web page (any file) to which we want to link (jump, open) and the words between the open and close of the anchor tag will be displayed as a hyperlink text. |
| Remember the file you want to open on an hyperlink should exist on the location you provided in the href attribute of the <a> tag. |
| The above Example will display the text in a browser: |
| And now click on above text you will get linked to website of csitquestion.com. And the Website of csitquestion.com gets opened in the new window. In this way a hyperlinking to jump to another page is done. |
| Target Attribute |
| With the target attribute, you can define where the linked document will be opened. The line below will open the document in a new browser window: <a href=”http://csitquestions.com/” target=”_blank”> Visit www.csitquestion.com </a> |
| 3) Link to a location on the same page The Anchor Tag and the Name Attribute The name attribute is used to create a named anchor. When using named anchors we can create linksthat can jump directly into a specific section on a page, instead of letting the user scroll around to find what he/she is looking for. |
| So the first write this named anchor on the section of the page to which you want to get link. |
| surround the text “Hyperlink” by a named tag as shown below: |
| Syntax of a named anchor: |
| <a name=”label”>Text (to which you want to link)</a> |
| Example: |
| <a name=”intro”> Hyperlinks </a> for e.g. Write this line instead of the Hyperlink at the top of page |
| In this way the the named anchor is defined on the same document in which Hyperlink section of this page is linked. The name attribute is used to create a named anchor. The name of the anchor can be any text you care to use. To link directly to the named anchor “intro” section, if from the end of the page you want to go to the Hyperlink introduction, then include the following line at the end of page in body section. |
| Add a # sign and the name of the anchor to the end of a URL, like this: |
| <a href=”#intro”> Hyperlinks Introduction (text you like) </a> |
| In this we use the href attribute of the <a> tag to link to named anchor “#intro” and which automatically jumps to the top of the page where it was defined. |
| Example: |
| Iif you want to link to the tips section of basic.html page of xyz.com then the formate will be: |
| <a href=”http://www.xyz.com/basic.html#tips”> Jump to the Useful Tips Section </a> |
| only the thing is that the basic.html page tips section should have a named anchor as |
| <a name=”tips” > TIPS </a> |
| so now you have done a lot in the links now you saw how simple hyperlinks are. |
| So now lets do some Practical. |
| Just write/copy this example on any text editor new file and save the file and open in the browser and see how it looks. |
| Example: |
| <html> <head> <title>Links</title> </head> <body> <b> Open a link in a new browser window (using href & target attribute of the tag). <br> <br> click here to go <a href=”http://csitquestions.com”> www.csitquestion.com.</a><br> <br> click here to go <a href=”hyperlinks.html”>hyperlinks.html.</a></font> Link to a location on the same page <br> <a name=”lesson8″ >Lesson 8</a><br> |
| Visit www.csitquestion.com |