PDA

View Full Version : Navigation Bar Links


Allie
05-26-2009, 04:08 AM
Hello.

I'm relatively new to Dreamweaver CSS and such.

If anyone could help me/point me to the right direction of how to add links to a navigation bar like this?

http://www.upload3r.com/serve/250509/1243307258.gif

Thank you.

domedia
05-26-2009, 04:20 AM
Where exactly are you stuck?
Regular links with a pipe character in between them would work.

Allie
05-26-2009, 04:21 AM
Um.

I really have no idea how to add the links in a navigation bar such as this o_o
I'm more used to separate buttons.

I'll try your suggestion, thank you.

edbr
05-26-2009, 05:36 AM
make a division with a color background, add your links.

Allie
05-26-2009, 11:57 PM
Okay I added new links to all of my images on my webpage. However, it doesn't seem to be working when I go to my webpage =/

Here's a link:

http://haleandallie.com

edbr
05-27-2009, 02:13 AM
there are no links in your code, have you uploaded the new page?

Allie
05-27-2009, 05:07 AM
Yes, I have.

Here's the code that I have on my Dreamweaver:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type">
<title>hale and allie</title>
<style type="text/css">
<!--
.Verdana {
font-family: Verdana, Geneva, sans-serif;
}
.Verdana p {
font-weight: bold;
}
-->
</style>
</head>
<body>
<center>
<a href="index.html"><img src="images/hale-and-allie.gif" alt="hale and allie" width="728" height="90" dynsrc="index.htm"></a>
</center>
<center>
<a href="index.html"|"about.html"|"downloads.html"|"contact.html"><img src="images/Nav-Bar-Orange.gif" width="550" height="30" alt="navigation bar"></a>
</center>
<center><table width="550" border="0">
<tr>
<td class="Verdana"><p>This website is currently under construction.
</p>
<p>la_vue_du_matin@hotmail.com</p>
<p>&nbsp;</p></td>
</tr>
</table></center>
<p>&nbsp; </p>
</body>
</html>

edbr
05-27-2009, 05:22 AM
ah i see
<a href="index.html"> Home |</a><a href="about.html"> About us|</a>
<a href="downloads.html"> Downloads |</a>
<a href="contact.html"> Contact us |</a>
thats your links
if you make a div use
images/Nav-Bar-Orange.gif as a background image for the div then put your links as above in the div

edbr
05-27-2009, 05:40 AM
in fact try this<head>

<style type="text/css">
<!--
#nav { background-color:#FF7505 ;
text-align:center;

width:1005;
}
#nav a:link { color:#FFF; text-decoration:none;
}
-->
</style>
</head>

<body>
<div id="nav"><a href="index.html"> Home |</a><a href="about.html"> About us|</a>
<a href="downloads.html"> Downloads |</a>
<a href="contact.html">Contact us |</a></div>
</body>
</html>

Allie
05-27-2009, 06:20 AM
Gah ~_~ Still doesn't work. The "hale and allie" banner doesn't work either. I'm trying to get it to link to the index.html

Here's the current code I have:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type">
<title>hale and allie</title>
<style type="text/css">
<!--
.Verdana {
font-family: Verdana, Geneva, sans-serif;
}
.Verdana p {
font-weight: bold;
}
-->
</style>
</head>
<body>
<center>
<a href="index.html"><img src="images/hale-and-allie.gif" alt="hale and allie" width="728" height="90" dynsrc="index.htm"></a>
</center>
<center>
<div id="nav"><a href="index.html"> Home |</a><a href="about.html"> About us|</a>
<a href="downloads.html"> Downloads |</a>
<a href="contact.html">Contact us |</a></div>
<img src="images/Nav-Bar-Orange.gif" width="550" height="30" alt="navigation bar"></a>
</center>
<center><table width="550" border="0">
<tr>
<td class="Verdana"><p>This website is currently under construction.
</p>
<p>la_vue_du_matin@hotmail.com</p>
<p>&nbsp;</p></td>
</tr>
</table></center>
<p>&nbsp; </p>
</body>
</html>

edbr
05-27-2009, 06:30 AM
add
#nav { background-color:#FF7505 ;
text-align:center;

width:100%;
}
#nav a:link { color:#FFF; text-decoration:none;
}
in the <style> section in the head

edbr
05-27-2009, 06:35 AM
and <a href="http://www.haleandallie.com (http://haleandallie.com/)/index.html"><img src="images/hale-and-allie.gif" alt="hale and allie" width="728" height="90" ></a> should work

Allie
05-27-2009, 06:38 AM
Yes it works now.

Thank you.

But the nav bar still doesn't link =/

edbr
05-27-2009, 07:27 AM
yes it does, i just tried it

Allie
05-27-2009, 07:43 AM
Yeah I know sorry XD

Check my re-edit on previous post =3
Thanks for helping!

edbr
05-27-2009, 08:21 AM
speaking of edits i just changed 1005 to 100% as it was supposed to be

Corrosive
05-27-2009, 08:23 AM
speaking of edits i just changed 1005 to 100% as it was supposed to be

He, he. Schoolboy error Ed?

edbr
05-27-2009, 08:40 AM
too many villa openings lately :)