160 likes | 278 Views
Internet Applications Development. Lecture 5 L. Obead Alhadreti. Lecture Outline:. Links with HTML. How do we move from a web page to another ?! We can move between web pages by clicking on a hyperlink .
E N D
Internet Applications Development Lecture 5 L. ObeadAlhadreti
Lecture Outline: • Links with HTML.
How do we move from a web page to another ?! • We can move between web pages by clicking on a hyperlink. • A hyperlink (or link) is a word, group of words, or image that you can click on to jump to a new destination. • Hyperlinks are the spirit of the Web. If the web is a spider as a whole, these links are the threads that make up this network and link between millions of addresses. • The question now is: How to insert a hyperlink?
Links inserted using the a (anchor) tag: <a> </a> • href(Hypertext Reference) attribute: href specifies the address you would like to link to. < a href=“address”> text/image </a>
Example: <a href=“index.html”> home page </a> • Display: home page
Example: <a href=“index.html”> <imgsrc=“1.jpg”> </a> • Display:
There are several options for hyperlinks: it can be a link to another site, another page within the site itself, a place in the same page (up or down), or an email address.
1st Type : Insert a hyperlink to an external web site. Example: <a href=“http://www.uqu.edu.sa”> Uqu</a> Display: Uqu
Example: <a href=“http://www.uqu.edu.sa”> <imgsrc=“uqu.jpg”> </a> Display:
2nd Type : link refers to an existing file in the same website (i.e. a local file), whether html file, image, or otherwise: Example: <a href=“timestable.html"> times table </a> Display: times table
Example: <a href="http://www.uqu.edu.sa/images/1.jpg "> first image </a> Display: first image
3rd Type : the link refers to a place within the same page,( for example at the beginning or at the end of the page or any other place you want) • To link to a place within your existing page, firstly, a name must be given to the anchor using the name attribute. example: <a name=“abc”> top </a>
Secondly, we create the links by placing the hash symbol followed by the name of the anchor in the href of the new link. example: <a name=“abc”> top </a> <a href=“#abc”> top </a>
Fth Type : the link refers to email address, using <a href=“mailto: …….@....... ”> </a> example: <a href=“mailto: ahmed@yahoo.com”> ahmed </a> Display: ahmed
Questions ? Be active !