4 Easy Steps to Create an Internal Page Jumps | Solution with Images
When most people think of two
different webpages together, Linking to another page on the Internet is pretty
much a standard part of designing a website. When someone clicks on a link, the
browser normally takes that person to the top of the new document. That is the
normal and expected behaviour. But what if you wanted to link to a specific paragraph or line within a page? For example you want to link a specific word
FAQ. So this article shows you how to do it with straightforward HTML.
These links are known as Hyper-links. Hyper-links allow visitors to navigate between Web sites by clicking
on words, phrases, and images. Thus you can create hyper-links using text or
images available on a webpage.
Here's
how you do it.
1. Documents
Linking
HTML tag <a> is used to specify a link. This tag is
called anchor tag and anything between the opening
<a> tag and the closing </a> tag becomes part of the link and a
user can click that part to reach to the linked document. Following is the syntax
to use <a> tag.
Example
This will generate a result,
when you click on the link generated curious point it’ll take you to the
homepage of curious alley.
Now, Move onto the next
step.
2. Select the
Target Attribute
We have already used target
attribute in the last example. There are some possible locations where target
linked document will open.
You can click on each generated
link to determine the difference between every option given for target
attribute.
3. Using Base
Path
Sometimes you got to link
documents related to the same website. But it’s not mandatory to give full link
every time. You can get free out of by using <base> tag in your HTML
header. This tag is used to give base path to entire program and it’ll make
complete URL using relative path and base path.
Example
Let’s take a <base> tag for
all program instead of complete URL.
So in the above code <a href= “/html/index.htm” will considered as <a
href= “http://www.curiousalley.com/html/index.htm”.
4. Link Colors
With the help of <body> tag
attributes link, alink and vlink you can color your links, active links and
visited links.
Example -
Let’s see how these attributes works. You
can save this document with .html extension and see how link, alink and vlink will function.
In the above example link will change its
color before clicking, when it activates and when it has been visited.
Congo! You've got a functioning hyper-links between two pieces of content.
A very informative post indeed! Thank you for sharing it with us. I have been looking to integrate the images in my post. I will use this method.
ReplyDeleteThese tips with images helped me alot in creating the internal page. I am really thankful to the author for posting this blog. Stay bleesed mate
ReplyDelete