Lesson 3: Linking It All Together
Upcoming SlideShare
Loading in...5

Lesson 3: Linking It All Together



This presentation

This presentation



Total Views
Views on SlideShare
Embed Views



3 Embeds 108

http://www.oliviamoran.me 85
http://vle.limerickcityaes.ie 17
http://oliviamoran.me 6



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

Lesson 3: Linking It All Together Lesson 3: Linking It All Together Presentation Transcript

  • < < HTML Lesson 3: Linking It All TogetherBy Olivia Moran[Codo Dojo – HTML Group Sligo, Ireland]liviamoran.mewww.oliviamoran.mehttp://www.slideshare.net/oliviamoran
  • Links
  • 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.
  • 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
  • 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>
  • 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>
  • 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>
  • 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>
  • 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>
  • 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>