Saturday, November 19, 2011

How would i make a horizontal navigation bar?

I want to make and put a horizontal navigation bar on my website but i dont know how to make one, also i need to know how to get the bars html and put it on the sight, i dont even know where to start|||Oh boy! This is a loaded question. To be honest, you are asking how to perform a task in a particular programming language, without knowing how to program! This is what people spend their lives studying just like any other craft.





However, let's see if we can get you in the right direction.





The best thing to do is use a combination of two technologies: HTML and CSS. These two languages work together on almost every web site you use. The HTML tells the browser what objects to display, and the CSS describes the look and feel of those objects! Pretty cool...





So what we need is a HTML "Unordered List" of links for your navigation bar, which can look like this:





%26lt;ul id="horizontal_nav"%26gt;


%26lt;li%26gt;Page 1%26lt;/li%26gt;


%26lt;li%26gt;Page 2%26lt;/li%26gt;


%26lt;li%26gt;Page 3%26lt;/li%26gt;


%26lt;/ul%26gt;





OK! So now we have an unordered list (ul) and 3 list items (li)...





That "id" in the unordered list element will be used to look up in the CSS to see how to draw this particular list!





Now in your CSS area or separate page you can put the following:





#horizontal_nav {


margin: 0;


padding: 0;


list-style-type: none;


}





#horizontal_nav li {


display: inline


}





This says make sure there are no bullets next to the list (list-style-type) and each list item will be displayed inline (next to each other)|||Check out some of the links below.

No comments:

Post a Comment