<        < HTML        Lesson 3: Linking It All TogetherBy Olivia Moran[Codo Dojo – HTML Group Sligo, Ireland]liviamoran.m...
Links
A tag                    What is it?• The HTML <a> tag defines a hyperlink.• A hyperlink (or link) is a word, group of wor...
A tag                      What is it?• By default, links will appear as follows in all  browsers:  An unvisited link is u...
External Links<html><body><p><a href="http://www.rte.ie/">RTENews</a> This is a link to the RTE NewsPage.</p><p><ahref="ht...
Target LinksThe target attribute specifies where to open thelinked document. The example below will openthe linked documen...
Linking To Parts Of A Page<html><body><p><a href="#C4">See also Chapter 4.</a></p><h2>Chapter 1</h2><p>This chapter explai...
Email Link<html><body><p>This is an email link:<a href="mailto:someone@example?Subject=Hello%20again"> Send Mail</a></p><p...
HTML Game (index.html)<html><body>Your name is <b><i>Codo Dojo</i></b>You are standing in front of a castlesurrounded by a...
HTML Game (room1.html)<html><body>you are in the castle <br/><img src="castle.jpg"></body></html>
HTML Game (room2.html)<html><body>You feel off a cliff<img src="cliff.jpg"></body></html>
Upcoming SlideShare
Loading in...5
×

Lesson 3: Linking It All Together

1,131
-1

Published on

This presentation

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,131
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Lesson 3: Linking It All Together

  1. 1. < < HTML Lesson 3: Linking It All TogetherBy Olivia Moran[Codo Dojo – HTML Group Sligo, Ireland]liviamoran.mewww.oliviamoran.mehttp://www.slideshare.net/oliviamoran
  2. 2. Links
  3. 3. A tag What is it?• The HTML <a> tag defines a hyperlink.• A hyperlink (or link) is a word, group of words, or image that you can click on to jump to another document.• When you move the cursor over a link in a Web page, the arrow will turn into a little hand.
  4. 4. A tag What is it?• By default, links will appear as follows in all browsers: An unvisited link is underlined and blue A visited link is underlined and purple An active link is underlined and red
  5. 5. External Links<html><body><p><a href="http://www.rte.ie/">RTENews</a> This is a link to the RTE NewsPage.</p><p><ahref="http://www.w3.org/">W3C</a> Thisis a link to a website on the World WideWeb.</p></body></html>
  6. 6. Target LinksThe target attribute specifies where to open thelinked document. The example below will openthe linked document in a new browser window ora new tab: <a href="http://www.rte.ie/"> target="_blank">Visit W3Schools!</a>
  7. 7. Linking To Parts Of A Page<html><body><p><a href="#C4">See also Chapter 4.</a></p><h2>Chapter 1</h2><p>This chapter explains ba bla bla</p><h2>Chapter 2</h2><p>This chapter explains ba bla bla</p><h2>Chapter 3</h2><p>This chapter explains ba bla bla</p><h2><a id="C4">Chapter 4</a></h2><p>This chapterexplains ba bla bla</p><h2>Chapter 5</h2><p>This chapter explains ba bla bla</p><h2>Chapter 6</h2><p>This chapter explains ba bla bla</p></body></html>
  8. 8. Email Link<html><body><p>This is an email link:<a href="mailto:someone@example?Subject=Hello%20again"> Send Mail</a></p><p><b>Note:</b> Spaces between wordsshould be replaced by %20 to ensure that thebrowser will display the text properly.</p></body></html>
  9. 9. HTML Game (index.html)<html><body>Your name is <b><i>Codo Dojo</i></b>You are standing in front of a castlesurrounded by a <b>shark filled</b> moat.You can <i>enter</i> the castle or<i>jump</i> in the moat.<p><a href ="room1.html">Enter</a> or<a href="room2.html"> Jump</a></nowiki></p></body></html>
  10. 10. HTML Game (room1.html)<html><body>you are in the castle <br/><img src="castle.jpg"></body></html>
  11. 11. HTML Game (room2.html)<html><body>You feel off a cliff<img src="cliff.jpg"></body></html>
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×