0% found this document useful (0 votes)
139 views

Module 6: Inserting Hyperlinks Module 6: Inserting Hyperlinks

This document provides instructions for creating hyperlinks and bookmarks within HTML documents. It describes how to insert browser logos as clickable links to new pages describing each browser. The main tasks are to create a main page with the browser logos linked to separate description pages, and to fill out each description page with headings, images, and paragraphs about the browser.

Uploaded by

Just Me
Copyright
© © All Rights Reserved
Available Formats
Download as PPSX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
139 views

Module 6: Inserting Hyperlinks Module 6: Inserting Hyperlinks

This document provides instructions for creating hyperlinks and bookmarks within HTML documents. It describes how to insert browser logos as clickable links to new pages describing each browser. The main tasks are to create a main page with the browser logos linked to separate description pages, and to fill out each description page with headings, images, and paragraphs about the browser.

Uploaded by

Just Me
Copyright
© © All Rights Reserved
Available Formats
Download as PPSX, PDF, TXT or read online on Scribd
You are on page 1/ 17

Module 6: Inserting

Hyperlinks
HTML Hyperlinks
• A hyperlink or link is a word, phrase or image that
a user can click on to jump to a new document or a
new section within the current document.
• Links are found in nearly all web pages. Links allow
users to click their way from page to page.
• Links are defined with the <a> and </a> tags.
• The href attribute is used specify the destination
address of the link.
Activity 23
The target attribute
• The target attribute specifies where to open the
link document.
• _blank – opens the link document in a new
window or tab
• _self – opens the link in the same window/tab as it
was clicked (default)
Activity 24
Image as links
• Images can also be used as links, just put them
inside the <a> and </a> tags.
• The border=0 property can be used to avoid
displaying borders around the image.
Activity 25
Creating bookmark links
• HTML bookmarks are used to allow readers to
jump to specific parts of a web page.
• Bookmarks can be useful if a web page is very
long.
• Bookmarks are created using the id attribute.
• IDs are called by adding the pound (#) symbol to
the ID name.
Activity 26
Activity 26
Laboratory
Exercise 11
Inserting Hyperlinks
Instructions
• Create a new HTML file and save it as
laboratory11.html
• The title should be “Laboratory 11”
• Create a <h1> heading that will display “Most
Popular Web Browsers”
• The heading should be written in “Arial” font.
• Insert the 6 browser logos as shown on the next
slide.
• All logos are sized 150px for height and width.
• A new html will be shown once any of the logos
were clicked. (ex. Laboratory11-chrome.html will
be shown once the logo of chrome is clicked).
• A total of 6 additional html files shall be created,
showing one browser per html file.
Instructions
• All additional files will be named laboratory11-
xx.html (xx is the browser it describes ex.
laboratory11-edge.html)
• All titles should be the browser it describes
• An <h1> heading shall be created showing the
name of the browser.
• The heading must be centered and written using
the “century gothic” font.
Instructions
• The browser’s logo shall be inserted after the
header.
• The logo should be centered and should be 300px
in height and width.
• A paragraph that describes the browser will come
after the image.
• All the browser’s names and developers should be
written in bold font.
Instructions
• The paragraph should be “fully justified” with a
50px indentation and should be written in
“verdana” font.
• An <h4> header showing “Back to main page”
shall be created.
• The header should be centered and should redirect
the user to the main page (laboratory11.html)
once clicked.

You might also like