Working with links and URL's
Creating a Hyperlink
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Creating a Hyperlink</TITLE>
</HEAD>
<BODY>
<H1>This is the FIRST PAGE</H1>
<BR/>
<BR/>
<H1><A href="refpage.html">Go to the REFERENCE PAGE</A></H1>
</BODY>
</HTML>
refpage.html
<!DOCTYPE>
<HTML>
<HEAD>
<TITLE>Creating a Reference Page</TITLE>
</HEAD>
<BODY>
<H1>This is the REFERENCE PAGE</H1>
</BODY>
</HTML>
Using the target attribute
the target attribute of the A element is used to specify the frame or the window in which you want to open the reference page.
you can open the reference page in the same window, new window,new tab, or in user defined frame.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Creating a Hyperlink with the target attribute</TITLE>
</HEAD>
<BODY>
<H1><A href="refpage.html" target="_blank">Go to the REFERENCE PAGE</A></H1>
<BR/>
<H3>(You are directed to a New Window)</h3>
</BODY>
</HTML>
Using the id Attribute
the id attribute is used to assign a unique identifier to the hyperlinks on a webpage.
you can access the hyperlinks, to which you have assigned the id attribute, by providing reference to other hyperlinks.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Creating a Hyperlink with id attribute</TITLE>
</HEAD>
<BODY>
<H1>This is TOP</H1>
<A id="top"></A>
<A href="#middle">Go to Middle</A>
<BR/>
<A href="#bottom">Go to Bottom</A>
<H1>This is TOP</H1>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<H1>This is MIDDLE</H1>
<A id="middle"></A>
<A href="#top">Go to Top</A>
<BR/>
<A href="#bottom">Go to Bottom</A>
<H1>This is MIDDLE</H1>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<H1>This is BOTTOM</H1>
<A id="bottom"></A>
<A href="#top">Go to Top</A>
<BR/>
<A href="#middle">Go to Middle</A>
<H1>This is BOTTOM</H1>
</BODY>
</HTML>
you can navigate directly to either the middle or the bottom of the page by clicking the corresponding hyperlink.
Linking to a Mail System
A mail system allows you to send and receive any number of e-mails.
you can use the href attribute of the A element to set the e-mail address of the recipient, such as mail;to:info@kogentindia.com
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Linking to Mail System</TITLE>
</HEAD>
<BODY>
<H1><A href="mailto:info@kogentindia.com">E-mail Us</A></H1>
</BODY>
</HTML>
in addition to the recipient id, you can also mention the carbon copy (cc), blind carbon copy(bcc),subject, and body of the e-mail in your code.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Linking to Mail System</TITLE>
</HEAD>
<BODY>
<H1><A href="mailto:info@kogentindia.com?subject=Example&cc=umar@kogentindia.com&bcc=ahmed@kogentindia.com&body=Hi,%0AThis is an example of linking a hyperlink to the mail system.%0ARegards.">E-mail Us</A></H1>
<BR/>
</BODY>
</HTML>
Implementing Links Relation
You already know that the rel attribute of the LINK element is used to connect the external resources with the current document.
if you want to link your document to the external stylesheet , you need to specify the value of the rel attribute as stylesheet.
you need to create a stylesheet with the .css extension to link it to the document.
exxample.css
body
{
color:#ff0000;
background-color:pink;
font-family: courier New;
}
h1{font-size:18pt;
color:green;}
p{font-size:12pt}
<!DOCTYPE>
<HTML>
<HEAD>
<TITLE>HTML Link Example</title>
<LINK rel="stylesheet" href="example.css" />
</HEAD>
<BODY>
<H1>This is an example of the Link relation</H1>
<P>Here is some text to be displayed as the body of the Web page.</P>
</BODY>
</HTML>
Creating a Hyperlink
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Creating a Hyperlink</TITLE>
</HEAD>
<BODY>
<H1>This is the FIRST PAGE</H1>
<BR/>
<BR/>
<H1><A href="refpage.html">Go to the REFERENCE PAGE</A></H1>
</BODY>
</HTML>
refpage.html
<!DOCTYPE>
<HTML>
<HEAD>
<TITLE>Creating a Reference Page</TITLE>
</HEAD>
<BODY>
<H1>This is the REFERENCE PAGE</H1>
</BODY>
</HTML>
Using the target attribute
the target attribute of the A element is used to specify the frame or the window in which you want to open the reference page.
you can open the reference page in the same window, new window,new tab, or in user defined frame.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Creating a Hyperlink with the target attribute</TITLE>
</HEAD>
<BODY>
<H1><A href="refpage.html" target="_blank">Go to the REFERENCE PAGE</A></H1>
<BR/>
<H3>(You are directed to a New Window)</h3>
</BODY>
</HTML>
Using the id Attribute
the id attribute is used to assign a unique identifier to the hyperlinks on a webpage.
you can access the hyperlinks, to which you have assigned the id attribute, by providing reference to other hyperlinks.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Creating a Hyperlink with id attribute</TITLE>
</HEAD>
<BODY>
<H1>This is TOP</H1>
<A id="top"></A>
<A href="#middle">Go to Middle</A>
<BR/>
<A href="#bottom">Go to Bottom</A>
<H1>This is TOP</H1>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<H1>This is MIDDLE</H1>
<A id="middle"></A>
<A href="#top">Go to Top</A>
<BR/>
<A href="#bottom">Go to Bottom</A>
<H1>This is MIDDLE</H1>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<BR/><BR/><BR/><BR/><BR/><BR/><BR/><BR/>
<H1>This is BOTTOM</H1>
<A id="bottom"></A>
<A href="#top">Go to Top</A>
<BR/>
<A href="#middle">Go to Middle</A>
<H1>This is BOTTOM</H1>
</BODY>
</HTML>
you can navigate directly to either the middle or the bottom of the page by clicking the corresponding hyperlink.
Linking to a Mail System
A mail system allows you to send and receive any number of e-mails.
you can use the href attribute of the A element to set the e-mail address of the recipient, such as mail;to:info@kogentindia.com
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Linking to Mail System</TITLE>
</HEAD>
<BODY>
<H1><A href="mailto:info@kogentindia.com">E-mail Us</A></H1>
</BODY>
</HTML>
in addition to the recipient id, you can also mention the carbon copy (cc), blind carbon copy(bcc),subject, and body of the e-mail in your code.
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Linking to Mail System</TITLE>
</HEAD>
<BODY>
<H1><A href="mailto:info@kogentindia.com?subject=Example&cc=umar@kogentindia.com&bcc=ahmed@kogentindia.com&body=Hi,%0AThis is an example of linking a hyperlink to the mail system.%0ARegards.">E-mail Us</A></H1>
<BR/>
</BODY>
</HTML>
Implementing Links Relation
You already know that the rel attribute of the LINK element is used to connect the external resources with the current document.
if you want to link your document to the external stylesheet , you need to specify the value of the rel attribute as stylesheet.
you need to create a stylesheet with the .css extension to link it to the document.
exxample.css
body
{
color:#ff0000;
background-color:pink;
font-family: courier New;
}
h1{font-size:18pt;
color:green;}
p{font-size:12pt}
<!DOCTYPE>
<HTML>
<HEAD>
<TITLE>HTML Link Example</title>
<LINK rel="stylesheet" href="example.css" />
</HEAD>
<BODY>
<H1>This is an example of the Link relation</H1>
<P>Here is some text to be displayed as the body of the Web page.</P>
</BODY>
</HTML>
No comments:
Post a Comment