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

Q3 Lesson 6 HTML Link

Uploaded by

Aidan Ramos
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
34 views

Q3 Lesson 6 HTML Link

Uploaded by

Aidan Ramos
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 12

HTML LINKS

Hyperlink/Hypertext
A hyperlink, or simply a link, is a digital reference
to data that the user can follow or be guided to
by clicking or tapping. A hyperlink points to a
whole document or a specific element within a
document.

Hypertext is text with hyperlinks.

The text that is linked is known as anchor text.


HTML LINKS
• HTML uses a hyperlink to link to another
document on the web
• HTML links are hyperlinks.
• You can click on a link and jump to another
document.
• When you move the mouse over a link, the
mouse arrow will turn into a little hand.
• A link does not have to be text. A link can be an
image or any other HTML element!
1. The Anchor Tag and the Href Attribute
<a> - anchor tag – used to create a link to another document
-it can point to any resource on the Web: an HTML page, an image, a sound file, a
movie, etc.

Syntax
The HTML <a> tag defines a hyperlink. It has the following syntax:
<a href="URL">link text</a>

The syntax of creating an anchor:


•A. A website
<a href="url">element content</a>

Where:
The <a> tag is used to create an anchor to link from.
The href attribute is used to address the document to link to
and the words between the open and close of the anchor tag will be displayed as a
hyperlink.
 The most important attribute of the <a> element is the
href attribute, which indicates the link's destination.
 The link text is the part that will be visible to the reader.
 Clicking on the link text, will send the reader to the
specified URL address.

Example
This example shows how to create a link to W3Schools.com:

<a href="https://www.w3schools.com/">Visit W3Schools.com!</a>


2. The Target Attribute
By default, the linked page will be displayed in the current
browser window. To change this, you must specify another
target for the link.
•The target attribute specifies where to open the linked
document.
•The target attribute can have one of the following values:
•_self - Default. Opens the document in the same
window/tab as it was clicked
•_blank - Opens the document in a new window or tab
•_parent - Opens the document in the parent frame
•_top - Opens the document in the full body of the window
Example
•Use target="_blank" to open the linked document in a
new browser window or tab:

<a href="https://www.w3schools.com/" target="_blank">Visit W3Schools!</a>


Use an Image as a Link
 To use an image as a link, just put the <img> tag
inside the <a> tag:
Example

<a href="default.asp"> <img src="smiley.gif" alt="HTML


tutorial" size="width:42px;height:42px;"> </a>
Link to an Email Address
 Use mailto: inside the href attribute to create a link that
opens the user's email program (to let them send a new email):

Example

<a href="mailto:[email protected]">Send email</a>


Summary
• Use the <a> element to define a link
• Use the href attribute to define the link address
• Use the target attribute to define where to open the
linked document
• Use the <img> element (inside <a>) to use an image as
a link
• Use the mailto: scheme inside the href attribute to
create a link that opens the user's email program

And, By default, links will appear as follows in all browsers:


• An unvisited link is underlined and blue
• A visited link is underlined and purple
• An active link is underlined and red
Title of Activity: Activity #11 HTML Hyperlink
Syntax :
<a href=”filename”> element content </a>

1. Open Exer10 and edit the following:

a. Apply a hyperlink on the title of your article to your Activity 1

Example:
<a href=“Filename of activity 1"> Title of the your article </a>

b. Apply a hyperlink on the first image to your Activity 3

Example:
<a href="Activity 3"><img src="desert.jpg" width="75“
height="55" alt="valleys" align="left"></a>
c. Apply a hyperlink on the second sentence of your file to your
Activity 5
d. Apply a hyperlink on the second image to your Activity 7
e. Apply a hyperlink on the third sentence of your file to your
Activity 8
f. Apply a hyperlink on the third image to your Activity 9

2. Save your file as exer11+initials (exer11evc)

You might also like