Sunday 15 October 2017

A site page can contain different connections that take you specifically to different pages and even particular parts of a given page. These connections are known as hyperlinks. 

Hyperlinks enable guests to explore between Web destinations by tapping on words, expressions, and pictures. Consequently you can make hyperlinks utilizing content or pictures accessible on a page. 

Note − I prescribe you to experience a short instructional exercise on Understanding URL 

Connecting Documents 

A connection is indicated utilizing HTML tag <a>. This tag is called stay tag and anything between the opening <a> tag and the end </a> tag turns out to be a piece of the connection and a client can click that part to reach to the connected archive. Following is the basic language structure to utilize <a> tag. 

<a href = "Document URL" ... attributes-list>Link Text</a> 

Case 
We should take a stab at following case which joins http://www.googletech786.com at your page − 

<!DOCTYPE html>
<html>
   
   <head>
      <title>Hyperlink Example</title>
   </head>
	
   <body>
      <p>Click following link</p>
      <a href = "http://www.googletech786.com" target = "_self">Tutorials Point</a>
   </body>
	
</html>

The objective Attribute 

We have utilized target trait in our past case. This ascribe is utilized to indicate the area where connected archive is opened. Following are the conceivable choices − 

Sr.NoOption & Description
1
_blank
Opens the linked document in a new window or tab.
2
_self
Opens the linked document in the same frame.
3
_parent
Opens the linked document in the parent frame.
4
_top
Opens the linked document in the full body of the window.
5
targetframe
Opens the linked document in a named targetframe.

Illustration 

Have a go at following case to comprehend fundamental distinction in couple of alternatives given for target property. 

<!DOCTYPE html>
<html>

   <head>
      <title>Hyperlink Example</title>
      <base href = "http://www.googletech786.com/">
   </head>
	
   <body>
      <p>Click any of the following links</p>
      <a href = "/html/index.htm" target = "_blank">Opens in New</a> |
      <a href = "/html/index.htm" target = "_self">Opens in Self</a> |
      <a href = "/html/index.htm" target = "_parent">Opens in Parent</a> |
      <a href = "/html/index.htm" target = "_top">Opens in Body</a>
   </body>

</html>
Utilization of Base Path 

When you connect HTML records identified with a similar site, it isn't required to give an entire URL for each connection. You can dispose of it in the event that you utilize <base> tag in your HTML report header. This tag is utilized to give a base way for every one of the connections. So your program will link given relative way to this base way and will make an entire URL. 

Case 

Following case influences utilization of <base> to tag to indicate base URL and later we can utilize relative way to every one of the connections as opposed to giving complete URL for each connection. 

<!DOCTYPE html>
<html>

   <head>
      <title>Hyperlink Example</title>
      <base href = "http://www.googltech786.com/">
   </head>
	
   <body>
      <p>Click following link</p>
      <a href = "/html/index.htm" target = "_blank">HTML Tutorial</a>
   </body>
	
</html>

Connecting to a Page Section 

You can make a connection to a specific area of a given site page by utilizing name characteristic. This is a two-advance process. 

Note − The name trait deplored in HTML5. Try not to utilize this property. Utilize id and title characteristic. 

To begin with make a connection to where you need to reach with-in a website page and name it utilizing <a...> tag as takes after − 

<h1>HTML Text Links <a name = "top"></a></h1>

Second step is to make a hyperlink to interface the archive and place where you need to reach − 

<a href = "/html/html_text_links.htm#top">Go to the Top</a>

This will create following connection, where you can tap on the connection produced Go to the Top to reach to the highest point of the HTML Text Link instructional exercise. 


Setting Link Colors 

You can set shades of your connections, dynamic connections and went to joins utilizing join, alink and vlink properties of <body> tag. 

Case 

Spare the accompanying in test.htm and open it in any web program to perceive how connect, alink and vlink traits work. 

<!DOCTYPE html>
<html>
   
   <head>
      <title>Hyperlink Example</title>
      <base href = "http://www.googletech786.com/">
   </head>
	
   <body alink = "#54A250" link = "#040404" vlink = "#F40633">
      <p>Click following link</p>
      <a href = "/html/index.htm" target = "_blank" >HTML Tutorial</a>
   </body>
   
</html>

Download Links 

You can make content connect to make your PDF, or DOC or ZIP records downloadable. This is exceptionally straightforward; you simply need to give finish URL of the downloadable document as takes after − 

<!DOCTYPE html>
<html>

   <head>
      <title>Hyperlink Example</title>
   </head>
	
   <body>
      <a href = "http://www.googletech786.com/page.pdf">Download PDF File</a>
   </body>
	
</html>

Record Download Dialog Box 

Now and then it is wanted that you need to give a choice where a client will click a connection and it will fly up a "Document Download" box to the client as opposed to showing real substance. This is simple and can be accomplished utilizing a HTTP header in your HTTP reaction. 

For instance, in the event that you need influence a Filename to document downloadable from a given connection then its language structure will be as per the following. 

#!/usr/bin/perl

# Additional HTTP Header
print "Content-Type:application/octet-stream; name = \"FileName\"\r\n";
print "Content-Disposition:attachment; filename = \"FileName\"\r\n\n";

# Open the target file and list down its content as follows
open( FILE, "<FileName" );

while(read(FILE, $buffer, 100)){
   print("$buffer");
}
Note − For more detail on PERL CGI programs, experience instructional exercise PERL and CGI.

0 comments:

Translate

GoogleTech786. Powered by Blogger.

Subscribe Youtube

Our Facebook Page

Wikipedia

Search results

Popular Posts

Adsense