links in xhtml please use speaker notes for additional information!

11
Links in XHTML Please use speaker notes for additional information!

Upload: meryl-fletcher

Post on 16-Jan-2016

214 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Links in XHTML Please use speaker notes for additional information!

Links in XHTML

Please use speaker notes for additional information!

Page 2: Links in XHTML Please use speaker notes for additional information!
Page 3: Links in XHTML Please use speaker notes for additional information!
Page 4: Links in XHTML Please use speaker notes for additional information!

In original HTML, this would be written as: <a name=“top”>. Some browers support id and some support name.

Because of support issues, you might consider coding this as:

<a id=“top” name=“top”>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><head><title>Linking within a page</title></head><body><div><a id="top"></a></div><h2>Linking within a page</h2><p>Four score and seven years ago, our fathers broughtforth on this continent a new nation, conceived inliberty and dedicated to the proposition that all menare created equal - I think I got the quote right, but...</p><p>Four score and seven years ago, our fathers broughtforth on this continent a new nation, conceived inliberty and dedicated to the proposition that all menare created equal - I think I got the quote right, but...</p><p>Four score and seven years ago, our fathers broughtforth on this continent a new nation, conceived inliberty and dedicated to the proposition that all menare created equal - I think I got the quote right, but...</p><div><a id="details"></a></div><ul><li>Delivered by Abraham Lincoln</li><li>Delivered at Gettysburg, Pennsylvania</li><li>Delivered on November 19 ,1863</li></ul><p><a id="fulltext">Gettysbury Adddress</a><br /><br />"Fourscore and seven years ago our fathers brought forth on this continent a new nation, conceived in liberty and dedicated to the proposition that all men are created equal. Now we are engaged in a great civil war, testing whether that nation or any nation so conceived and so dedicated can long endure. We are met on a great battlefield of that war. We have come to dedicate a portion of that field as a final resting-place for those who here gave their lives that that nation might live. It is altogether fitting and proper that we should do this.

In the top and details anchors, notice that there are no words between the <a> and the </a>, This means there is nothing visible on the page that indicates this is a link to location. In the fulltext example, the words Gettysburg Address are between the <a> and the </a> so the words appear on the page.

Page 5: Links in XHTML Please use speaker notes for additional information!

<p>Four score and seven years ago, our fathers broughtforth on this continent a new nation, conceived inliberty and dedicated to the proposition that all menare created equal - I think I got the quote right, but...</p><p><a href="#top">Go to the top</a><br /><a href="#details">Go to the details</a><br /><a href="#fulltext">Go to the full text</a></p></body></html>

Page 6: Links in XHTML Please use speaker notes for additional information!
Page 7: Links in XHTML Please use speaker notes for additional information!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><head><title>Linking to another page</title></head><body><h1>Linking using a href</h1><p>When you link to another page you need to give the name of the page and the unless thepage is located in the same directory, you need to give the address of the page that youare going to bring up as the new page. If the page is on your hard drive, you use harddrive addresses. If the page is out on the web, you use web addresses. If the page isat a totally different web site, you should use the complete address starting with http.</p><p>Link to another page in the same directory</p><p><a href="linkwithinpageid.html">Link to linkwithinpageid.html</a></p><p>Link to an anchor spot within another page - still in same directory</p><p><a href="linkwithinpageid.html#fulltext">Link to fulltext within linkwithinpageid.html</a></p><p>Link to a different web site - in this case the BCC web site</p><p><a href="http://www.bristol.mass.edu">Link to BCC</a></p></body></html>

When you are linking to an anchor within a page as opposed to the top of the page, you use the #followed by the id or name assigned to the anchor.

Page 8: Links in XHTML Please use speaker notes for additional information!

This illustrates hover.

This illustrates active.

This is where I am having problems. This is the color for visited.

Page 9: Links in XHTML Please use speaker notes for additional information!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><head><title>Linking to another page</title>

<style type="text/css">a:visited {color:green;}a:link {color:yellow;}a:active {color:blue;}a:hover {color:red;}</style></head><body><h1>Linking using a href</h1><p>Link establishes the color of the link before it is activated, vlink establishes the colorof the link after it has been visited and alink establishes the color of the link while it is active - a quick change in the color when the link is clicked.</p><p>When you link to another page you need to give the name of the page and the unless thepage is located in the same directory, you need to give the address of the page that youare going to bring up as the new page. If the page is on your hard drive, you use harddrive addresses. If the page is out on the web, you use web addresses. If the page isat a totally different web site, you should use the complete address starting with http.</p><p>Link to another page in the same directory</p><p><a href="linkwithinpageid.html">Link to linkwithinpageid.html</a></p><p>Link to an anchor spot within another page - still in same directory</p><p><a href="linkwithinpageid.html#fulltext">Link to fulltext within linkwithinpageid.html</a></p><p>Link to a different web site - in this case the BCC web site</p><p><a href="http://www.bristol.mass.edu">Link to BCC</a></p></body></html>

Page 10: Links in XHTML Please use speaker notes for additional information!
Page 11: Links in XHTML Please use speaker notes for additional information!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><head><title>Linking to another page</title></head><body bgcolor="beige" text="purple" link="yellow" vlink="green" alink="orange"><h1>Linking using a href</h1><p>Link establishes the color of the link before it is activated, vlink establishes the colorof the link after it has been visited and alink establishes the color of the link while it is active - a quick change in the color when the link is clicked.</p><p>When you link to another page you need to give the name of the page and the unless thepage is located in the same directory, you need to give the address of the page that youare going to bring up as the new page. If the page is on your hard drive, you use harddrive addressess. If the page is out on the web, you use web addresses. If the page isat a totally different web site, you should use the complete address starting with http.</p><p>Link to another page in the same directory</p><p><a href="linkwithinpageid.html">Link to linkwithinpageid.html</a></p><p>Link to an anchor spot within another page - still in same directory</p><p><a href="linkwithinpageid.html#fulltext">Link to fulltext within linkwithinpageid.html</a></p><p>Link to a different web site - in this case the BCC web site</p><p><a href="http://www.bristol.mass.edu">Link to BCC</a></p></body></html>