16
Unit 6 – Link Presentation 2 Web Programming

M02 un06 p02

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: M02 un06 p02

Unit 6 – Link

Presentation 2

Web Programming

Page 2: M02 un06 p02

Objectives

At the end of this presentation, you will be able to• Differentiate Internal and External Hyperlinks• Open a Web page in a new Window

Page 3: M02 un06 p02

External Hyperlink

• The external Hyperlink is a hyperlink that is linked to another HTML document.

• Following figure will explain the working of External Hyperlink.

Page 4: M02 un06 p02

Lab Exercise

3. Open D6_2.html in Internet Explorer. a. Identify the tag which is used to create

link in source code D6_2.html.b. Underline the attribute which is used with

the <A> tag to specify the name of the file to be linked to.

c. Name the attribute which is used to sets the colour for active links, visited links and hyper links in source code D6_2.html.

Page 5: M02 un06 p02

Lab Exercise

4. Open D6_2.html in Internet Explorer.

a. View the source code in notepad.

b. Apply the active link colour to Maroon.

c. Apply the visited link colour to Yellow.

d. Apply the hyperlink colour to Green.

e. Save the file and view the output in the browser.

Page 6: M02 un06 p02

Lab Exercise

5. Open Malaysia.HTML that you have created under the folder in your name in C:a. When you click on the text “States of

Malaysia”, the “States.HTML” which you have created under the folder in your name in C: should open in new window.

b. When you click on the text “Festival”, the “Festivals.HTML” which you have created under the folder in your name in C: should open in new window.

Page 7: M02 un06 p02

Lab Exercise contd.

c. When you click on the text “Whether and Climate in Malaysia”, the “Climate.HTML” which you have created under the folder in your name in C: should open in next window.

Page 8: M02 un06 p02

Link Colour

• The hyperlink is distinguished from ordinary text by the colour.

• There are three states of a link. • They are

- The link that has not been visited earlier.- The link that is being visited.- The link that had been already visited.

Page 9: M02 un06 p02

Link Colour Contd.

• The default colours of a link in 3 different states are given in Table.

Page 10: M02 un06 p02

Link Colour Contd.

• The attributes used to change the colour of the links in different states are given in Table.

Page 11: M02 un06 p02

Anchor Tag and Target Attr.

• The Target attribute can also be used within the anchor tag.

• This attribute specifies where the linked document should be opened.

• Example:

<A Href = “Answers.html” Target = “_blank”> Answers </A>.

Page 12: M02 un06 p02

Activity 2.6.1

• Create a web page that explains Hyperlink as shown in Figure.

• Save the HTML file as Activity1.html in C:\HTML\Unit6\Activity folder.

Page 13: M02 un06 p02

Activity 2.6.1 Contd.

Page 14: M02 un06 p02

Summary

In this presentation, you learnt the following:• To open the linked document in a new

window, the value to be assigned to the Target attribute is _blank.

• The default colour of unvisited link is Blue.• The default colour of visited link is Purple.

Page 15: M02 un06 p02

Summary

• The default colour of active link is Red.• The attributes of the <BODY> tag that are

used to change the colour of the link are LINK, ALINK and VLINK.

Page 16: M02 un06 p02

Assignment

1. Write how will you change the colour of the Hyperlinks?

2. Name the three states of link in HTML.