Planet Shake
You are watching the site as a guest to see everything that gets offered register for free or log in....or take a look around on the few things that you can see as a guest.....

Planet Shake

Discover Your World Here !
 
HomeHome  PortalPortal  GalleryGallery  FAQFAQ  MemberlistMemberlist  UsergroupsUsergroups  RegisterRegister  Log inLog in  

Share | 
 

 Lesson : Links

View previous topic View next topic Go down 
AuthorMessage
Admin
Admin
Admin


Posts : 163
Points : 13075
Reputation : 69
Join date : 2009-02-08
Age : 22
Location : Montalban Rizal (Philippines)

PostSubject: Lesson : Links   Thu May 20, 2010 7:29 pm

Lesson : Links


In this lesson, you will learn how to make links between pages.

What do I need to make a link?


To make links, you use what you always use when coding HTML: an
element. A simple element with one attribute and you will be
able to link to anything and everything
. Here is an example of
what a link to HTML.net could look like:

Example 1:



Code:

<a href="http://www.html.net/">Here is a link to HTML.net</a>




Would look like this in the browser:

Here is a link to HTML.net



The element a stands for "anchor". And the attribute href
is short for "hypertext reference", which specifies where the link
leads to - typically an address on the internet or a file name.
In the above example the attribute href has the value
"http://www.html.net", which is the full address of HTML.net and is
called a URL (Uniform Resource Locator). Note that "http://" must always
be included in URLs. The sentence "Here is a link to HTML.net" is the
text that is shown in the browser as the link. Remember to close the
element with an .

What about links between my own pages?


If you want to make a link between pages on the same website, you do
not need to spell out the entire address (URL) for the document. For
example, if you have made two pages (let us call them page1.htm and
page2.htm) and saved them in the same folder you can make a link from
one page to the other by only typing the name of the file in the link.
Under such circumstances a link from page1.htm to page2.htm could look
like this:

Example 2:



Code:

<a href="page2.htm">Click here to go to page 2</a>




If page 2 were placed in a subfolder (named "subfolder"), the link
could look like this:

Example 3:



Code:

<a href="subfolder/page2.htm">Click here to go to page 2</a>




The other way around, a link from page 2 (in the subfolder) to page 1
would look like this:

Example 4:



Code:

<a href="../page1.htm">A link to page 1</a>




"../" points to the folder one level up from position of the file
from which the link is made. Following the same system, you can also
point two (or more) folders up by writing "../../".
Did you understand the system? Alternatively, you can always type the
complete address for the file (URL).

What about internal links within a page?


You can also create internal links within a page - for example a
table of contents at the top with links to each chapter below. All you
need to use is a very useful attribute called id
(identification) and the symbol "#".
Use the id attribute to mark the element to which you
want to link. For example:

Code:

<h1 id="heading1">heading 1</h1>




You can now create a link to that element by using "#" in the link
attribute. The "#" must be followed by the id of the tag
you want to link to. For example:

Code:

<a href="#heading1">Link to heading 1</a>




All will become clear with an example:

Example 5:



Code:

<html>
 
  <head>
  </head>

  <body>

    <p><a href="#heading1">Link to heading 1</a></p>
    <p><a href="#heading2">Link to heading 2</a></p>

    <h1 id="heading1">heading 1</h1>
    <p>Text text text text</p>

    <h1 id="heading2">heading 2</h1>
    <p>Text text text text</p>
 
  </body>

</html>




will look like this in the browser (click on the two links):

Link
to heading 1
Link
to heading 2

Heading 1


Text text text text
Heading 2


Text text text text



(Note: An id attribut must start with a letter)

Can I link to anything else?


You can also make a link to an e-mail address. It is done in almost
the same way as when you link to a document:

Example 6:



Code:

<a href="mailto:nobody@html.net">Send an e-mail to nobody at HTML.net</a>




will look like this in the browser:

Send an e-mail to nobody at HTML.net



The only difference between a link to an e-mail and a link to a file
is that instead of typing the address of a document, you type mailto:
followed by an e-mail address. When the link is clicked, the default
e-mail program opens with a new blank message addressed to the specified
e-mail address. Please note that this function will only work if there
is an e-mail program installed on your computer. Give it a try!

Are there any other attributes I should know of?


To create a link, you always have to use the href
attribute. In addition, you can also put a title on your
link:

Example 7:



Code:

<a href="http://www.html.net/" title="Visit HTML.net and learn HTML">HTML.net</a>




Would look like this in the browser:

HTML.net



The title attribute is used to type a short description of the link.
If you - without clicking - place the cursor over the link, you will see
the text "Visit HTML.net and learn HTML" appears.

_________________
Back to top Go down
View user profile http://cursebox.tk
Admin
Admin
Admin


Posts : 163
Points : 13075
Reputation : 69
Join date : 2009-02-08
Age : 22
Location : Montalban Rizal (Philippines)

PostSubject: Re: Lesson : Links   Thu May 20, 2010 7:30 pm

try this htmledit.squarefree.com dito ako nag eedit ng code kapag wala yung dreamweaver ko...

_________________
Back to top Go down
View user profile http://cursebox.tk
 
Lesson : Links
View previous topic View next topic Back to top 
Page 1 of 1
 Similar topics
-
» XHTML - Lesson 5/5
» Urgent --- how to get links under specific panel/ div/ table
» How to verify the url displayed after click the links is correct (Selenium RC and Webdriver)?
» Xpath Syntax
» How to verify all element present in application.

Permissions in this forum:You cannot reply to topics in this forum
Planet Shake :: Graphics & Multimedia :: HTML & Website Design-
Jump to:  
Private forum on Forumotion | © phpBB | Free forum support | Contact | Report an abuse | Forumotion.com