Scribd
Upload
78 views7 pages

Lecture 6

The lecture discusses how to create different types of links in HTML documents, including email links, external links, and links to specific sections within documents. Email links open the default email client when clicked, external links open other websites, and section links allow navigation within or between documents by jumping to named sections. Graphics can be inserted into documents using the <img> tag.

Uploaded by

soundar23
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
78 views7 pages

Lecture 6

The lecture discusses how to create different types of links in HTML documents, including email links, external links, and links to specific sections within documents. Email links open the default email client when clicked, external links open other websites, and section links allow navigation within or between documents by jumping to named sections. Graphics can be inserted into documents using the <img> tag.

Uploaded by

soundar23
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 7

Lecture 6 Today we will learn about Create an Email link and External link. Insert graphics.

s. Link to specific section in another document. Create an Email link When you visit a web site, generally at the bottom you see a link for mail to the creator of the website. The subject of todays lecture is how to create such link. Such a link which on clicking opens an email client is called as email link. Please type the following code in notepad and save as .html file. <html> <head> <title>mail</title> </head> <body> My name is Harshit Kumar. <br> I am studying at University of Suwon <br> To mail me, Please <a href="mailto:[email protected]">Click here</a> </body> </html> The output will be My name is Harshit Kumar. I am studying at University of Suwon To mail me, Please Click here When you will click on Click here, mail client will open, through which you can send email. Create an External Link When you visit a web site, you find links to other websites. When you click on the link, another web site opens. Such a link which on clicking opens another website is called as external link Please type the following code in notepad and save as .html file. <html> <head> <title>mail</title> </head> <body> My name is Harshit Kumar. <br> I am studying at University of Suwon <br>

The sites I visit for fun are <ol> <li><a href="http://www.yahoo.com">Yahoo</a></li> <li><a href="http://www.hotmail.com">Hotmail</a></li> </ol> To mail me, Please <a href="mailto:[email protected]">Click here</a> </body> </html> The output will be My name is Harshit Kumar. I am studying at University of Suwon The sites I visit for fun are 1. Yahoo 2. Hotmail To mail me, Please Click here So, when you will click on Yahoo, yahoo website will open, and if you will click on Hotmail, Hotmail website will open. Insert Graphics Most of the websites that you visit contain graphics along with text. So graphics need to be inserted in a web page. To understand this, you need an image file, please download an image file from the internet or locate for an image file on your computer. I have got an image file by the name of asia.gif. <html> <head> <title>mail</title> </head> <body> My name is Harshit Kumar. <br> I am studying at University of Suwon <br> Below is the map of Asia<br> <img src="asia.gif" alt="map of asia"> </body> </html> And the output is My name is Harshit Kumar. I am studying at University of Suwon

Below is the map of Asia

Link to specific section in another document In lecture5 we discussed about, how to make a link from one document to another document. Now we will learn about how to make a link to specific part inside a document. Lets take the previous example Type the following code and save as first.html <html> <head> <title> First Page</title> </head> </body> My name is Harshit Kumar. <br> I am teaching at Suwon University <br> My hobbies are <br> <a href="hobbies.html#soccer">Soccer</a><br> <a href="hobbies.html#music">Music</a><br> <a href="hobbies.html#read">Reading</a><br>

</body> </html> And type the following code and save as hobbies.html <html> <head> <title>This is my hobby page</title> </head> <body> <b>My hobbies are</b><br> <a name="music"> <p align="center">Listenin Music</p></a> <p> I like listening to music a lot.<br> I like rock, instrumental music.<br> My favorites are <br> <ul> <li>Michael Jackson</li> <li>Aerosmith</li> <li>Savage Garden</li> <li>Celin Deon</li> <li>Guns & Roses</li> <li>Britny Spears</li> <li>50 Cents</li> <li>Richard Marx</li> <li>Elton John</li> <li>Bryan Adams</li> <li>All Saints</li> <li>Backstreet Boys</li> <li>Bon Jovi </li> <li>Eminem</li> <li>Enrique Iglesias</li> <li>Eric Clapton</li> <li>George Michael</li> <li>Faithless</li> <li>Queeb</li> <li>Cher</li> <li>Janet Jackson</li> <li>Jennifer Lopez</li> <li>Jewel</li> <li>Kylie Minogue</li> </ul> </p>

<a name="read"> My favorites are <br> <ul>

<p align="center">Reading </p></a> <li>Computer Books</li> <li>Fiction</li> <li>Non-fiction</li> <li>Science</li> <li>Newspaper</li>

</ul> <a name="soccer"><p align="center">Soccer</p></a> <ul> My favorite players are <li>David Batty, Leeds United </li> <li>Marcus Bent, Ipswich Town </li> <li>Craig Burley, Derby County </li> <li>Mike Salmon, Ipswich Town </li> <li>David Seaman, Arsenal </li> <li>Craig Short, Blackburn Rovers </li> <li>Dean Windass, Middlesbrough</li> </ul> </body> </html> Now when you will click on soccer, hobbies.html will open and scroll down, so that you can see the details about soccer. Similarly, when you click on music , hobbies.html will open and if required, page will scroll down, so that you can see the details about music. Links to Specific Sections within the Same Document The above concept can also be used for linking a specific section with in the same document. For example. <html> <head> <title>This is my hobby page</title> </head> <body> <b>My hobbies are</b><br> <a href="#music">Listening Music</a><br> <a href="#read">Reading</a><br> <a href="#soccer">Soccer</a><br> <a name="music"><p align="center">Listenin Music</p></a>

<p> I like listening to music a lot.<br> I like rock, instrumental music.<br> My favorites are <br> <ul> <li>Michael Jackson</li> <li>Aerosmith</li> <li>Savage Garden</li> <li>Celin Deon</li> <li>Guns & Roses</li> <li>Britny Spears</li> <li>50 Cents</li> <li>Richard Marx</li> <li>Elton John</li> <li>Bryan Adams</li> <li>All Saints</li> <li>Backstreet Boys</li> <li>Bon Jovi </li> <li>Eminem</li> <li>Enrique Iglesias</li> <li>Eric Clapton</li> <li>George Michael</li> <li>Faithless</li> <li>Queeb</li> <li>Cher</li> <li>Janet Jackson</li> <li>Jennifer Lopez</li> <li>Jewel</li> <li>Kylie Minogue</li> </ul> </p> <a name="read"> My favorites are <br> <ul>

<p align="center">Reading </p></a> <li>Computer Books</li> <li>Fiction</li> <li>Non-fiction</li> <li>Science</li> <li>Newspaper</li>

</ul> <a name="soccer"><p align="center">Soccer</p></a> <ul>

My favorite players are <li>David Batty, Leeds United </li> <li>Marcus Bent, Ipswich Town </li> <li>Craig Burley, Derby County </li> <li>Mike Salmon, Ipswich Town </li> <li>David Seaman, Arsenal </li> <li>Craig Short, Blackburn Rovers </li> <li>Dean Windass, Middlesbrough</li> </ul> </body> </html>

You might also like