html essentials hypertext. why hypertext ? hypertext is text or pictures which reference other pages...
TRANSCRIPT
HTML EssentialsHyperText
Why HyperText ?
• Hypertext is text or pictures which reference other pages which the reader can immediately access
• Hypertext pages are interconnected by hyperlinks, typically activated by a mouse click, key-press sequence, or by touching the screen
• Hypertext documents can either be static ( prepared and stored in advance ) or dynamic ( continually changing in response to user input )
Where HyperText Occurs
• Hypertext will only occur within the < body > tag
• Produces
• Links other web pages / files to the current page
• Use can randomly select where to read next
Basic Tag
• The < a > and < /a > tags form the basis of the hyperlink
• The HyperLink has two anchors:
• Invisible anchor: Where the link goes
• Visible anchor: What the user sees
< a <<options>> > Link text < /a > [ invisible ] [ Visible ]
< a > tag: Visible Anchor
• The Visible Anchor is the window dressing part of the < a > tag
• It is visible to the user
• Text saying almost anything
• Picture
• Outline line
• User will just click on the item to access the Invisible Anchor
< a > tag: Invisible Anchor
• The Invisible Anchor is the actual working part of the < a > tag
• The first attribute ( almost always specified ) is the href
• The href specifies the destination anchor and will accept almost any protocol
• http://
• ftp://
• telnet://
• mailto:
< a > tag: Invisible Anchor
• Other attributes that are part of the < a > tag
• href: lists the destination portion
• title or id: provide additional / advisory information about the tag
• name: provide a name so that another link may access it
• target: discussed more when studying frames
• Several more attributes available. Most have been deprecated by HTML5
href attribute
• The href attribute is specified in almost all uses of the < a > tag
• To link to other pages on the Internet:
• href:// < web site address outside the current site >
href="http://www.philscis.com/csis1430main.html"
• href: < page within the current web site >
href="csis1430Syllabus.pdf
href attribute
• To link to the same page
<!-- Here is the link --><p>You can check the facts by reading the
<a href="#refs">references</a> at the end of this article</p>
<!-- Here is the link’s destination -->
<a id="refs" href="#refs">References</a>
href attribute
• The href command can also be used to invoke other protocols
• An email link<a href="mailto:[email protected]?subject=Hello&body=body text">Send Mail</a>
• Invoke telnet<a href="telnet://10.0.0.230">Router at
10.0.0.230</a><a href="ssh://10.0.0.230">Router at
10.0.0.230</a>• Invoke FTP
<a href="ftp://someftpserver.com">An FTP server</a>
title or id attribute
• The title or id attribute will display text while hovering over the link
• There are several other attributes available that are available but are not used generally
Link colors
• Link may have three states• Link: state when hasn’t been touched
• Active: just as user selects
• Visited: after selection
• Colors• Default: blue, red, purple
• May be changed by using values in <BODY> tag or thru CSS
• Attribute names are: link, alink, vlink
• May be altered by using these attributes within the < body > tag and assigning new colors
The End